@gtkx/react 0.19.0 → 0.21.0

package/src/generated/compounds.ts

@@ -0,0 +1,2741 @@
+import { createContainerSlotChild, createMenuChild, createNavigationPageChild, createVirtualChild } from "../components/compound.js";
+import { createSlotWidget } from "../components/slot-widget.js";
+import { type FixedChildProps, type GridChildProps, type MenuItemProps, type MenuSectionProps, type MenuSubmenuProps, type NavigationSplitViewPageProps, type NavigationViewPageProps, type NotebookPageProps, type NotebookPageTabProps, type OverlayChildProps, type ShortcutProps, type StackPageProps, type TextAnchorProps, type TextPaintableProps, type TextTagProps } from "../jsx.js";
+import { type AdwActionRowProps, type AdwAlertDialogProps, type AdwApplicationWindowProps, type AdwBottomSheetProps, type AdwEntryRowProps, type AdwExpanderRowProps, type AdwFlapProps, type AdwHeaderBarProps, type AdwMessageDialogProps, type AdwNavigationSplitViewProps, type AdwNavigationViewProps, type AdwOverlaySplitViewProps, type AdwPreferencesGroupProps, type AdwPreferencesPageProps, type AdwSplitButtonProps, type AdwTabBarProps, type AdwToolbarViewProps, type AdwViewStackProps, type AdwWindowProps, type GtkActionBarProps, type GtkCenterBoxProps, type GtkExpanderProps, type GtkFixedProps, type GtkFrameProps, type GtkGridProps, type GtkHeaderBarProps, type GtkMenuButtonProps, type GtkNotebookProps, type GtkOverlayProps, type GtkPanedProps, type GtkPopoverMenuBarProps, type GtkPopoverMenuProps, type GtkShortcutControllerProps, type GtkSourceViewProps, type GtkStackProps, type GtkTextViewProps, type GtkWindowProps } from "./jsx.js";
+import { type ReactNode } from "react";
+
+/**
+ * A [`Gtk.ListBoxRow`](https://docs.gtk.org/gtk4/class.ListBoxRow.html) used to present actions.
+ *
+ * ![action-row](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/action-row.png)
+ *
+ * The `AdwActionRow` widget can have a title, a subtitle and an icon. The row
+ * can receive additional widgets at its end, or prefix widgets at its start.
+ *
+ * It is convenient to present a preference and its related actions.
+ *
+ * `AdwActionRow` is unactivatable by default, giving it an activatable widget
+ * will automatically make it activatable, but unsetting it won't change the
+ * row's activatability.
+ *
+ * ## AdwActionRow as GtkBuildable
+ *
+ * The `AdwActionRow` implementation of the [`Gtk.Buildable`](https://docs.gtk.org/gtk4/iface.Buildable.html) interface
+ * supports adding a child at its end by specifying “suffix” or omitting the
+ * “type” attribute of a `<child>` element.
+ *
+ * It also supports adding a child as a prefix widget by specifying “prefix” as
+ * the “type” attribute of a `<child>` element.
+ *
+ * ## CSS nodes
+ *
+ * `AdwActionRow` has a main CSS node with name `row`.
+ *
+ * It contains the subnode `box.header` for its main horizontal box, and
+ * `box.title` for the vertical box containing the title and subtitle labels.
+ *
+ * It contains subnodes `label.title` and `label.subtitle` representing
+ * respectively the title label and subtitle label.
+ *
+ * ## Style classes
+ *
+ * `AdwActionRow` can use the `.property`
+ * style class to emphasize the row subtitle instead of the row title, which is
+ * useful for displaying read-only properties.
+ *
+ * ![property-row](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property-row.png)
+ *
+ * When used together with the `.monospace` style class, only the subtitle
+ * becomes monospace, not the title or any extra widgets.
+ */
+export const AdwActionRow: ((props: AdwActionRowProps) => ReactNode) & {
+    AddPrefix: (props: { children?: ReactNode }) => ReactNode;
+    AddSuffix: (props: { children?: ReactNode }) => ReactNode;
+} = Object.assign(createSlotWidget<AdwActionRowProps>("AdwActionRow", []), {
+    AddPrefix: createContainerSlotChild("addPrefix"),
+    AddSuffix: createContainerSlotChild("addSuffix"),
+});
+
+/**
+ * A dialog presenting a message or a question.
+ *
+ * ![alert-dialog](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/alert-dialog.png)
+ *
+ * Alert dialogs have a heading, a body, an optional child widget, and one or
+ * multiple responses, each presented as a button.
+ *
+ * Each response has a unique string ID, and a button label. Additionally, each
+ * response can be enabled or disabled, and can have a suggested or destructive
+ * appearance.
+ *
+ * When one of the responses is activated, or the dialog is closed, the
+ * [`AlertDialog.:response`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/signal.AlertDialog.response.html) signal will be emitted. This signal is
+ * detailed, and the detail, as well as the `response` parameter will be set to
+ * the ID of the activated response, or to the value of the
+ * [`AlertDialog.close-response`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.AlertDialog.close-response.html) property if the dialog had been closed
+ * without activating any of the responses.
+ *
+ * Response buttons can be presented horizontally or vertically depending on
+ * available space.
+ *
+ * When a response is activated, `AdwAlertDialog` is closed automatically.
+ *
+ * An example of using an alert dialog:
+ *
+ * ```c
+ * AdwDialog *dialog;
+ *
+ * dialog = adw_alert_dialog_new (_("Replace File?"), NULL);
+ *
+ * adw_alert_dialog_format_body (ADW_ALERT_DIALOG (dialog),
+ *                               _("A file named “%s” already exists. Do you want to replace it?"),
+ *                               filename);
+ *
+ * adw_alert_dialog_add_responses (ADW_ALERT_DIALOG (dialog),
+ *                                 "cancel",  _("_Cancel"),
+ *                                 "replace", _("_Replace"),
+ *                                 NULL);
+ *
+ * adw_alert_dialog_set_response_appearance (ADW_ALERT_DIALOG (dialog),
+ *                                           "replace",
+ *                                           ADW_RESPONSE_DESTRUCTIVE);
+ *
+ * adw_alert_dialog_set_default_response (ADW_ALERT_DIALOG (dialog), "cancel");
+ * adw_alert_dialog_set_close_response (ADW_ALERT_DIALOG (dialog), "cancel");
+ *
+ * g_signal_connect (dialog, "response", G_CALLBACK (response_cb), self);
+ *
+ * adw_dialog_present (dialog, parent);
+ * ```
+ *
+ * ## Async API
+ *
+ * `AdwAlertDialog` can also be used via the [`AlertDialog.choose`](https://docs.gtk.org/alertdialog/method.choose.html) method.
+ * This API follows the GIO async pattern, for example:
+ *
+ * ```c
+ * static void
+ * dialog_cb (AdwAlertDialog *dialog,
+ *            GAsyncResult   *result,
+ *            MyWindow       *self)
+ * {
+ *   const char *response = adw_alert_dialog_choose_finish (dialog, result);
+ *
+ *   // ...
+ * }
+ *
+ * static void
+ * show_dialog (MyWindow *self)
+ * {
+ *   AdwDialog *dialog;
+ *
+ *   dialog = adw_alert_dialog_new (_("Replace File?"), NULL);
+ *
+ *   adw_alert_dialog_format_body (ADW_ALERT_DIALOG (dialog),
+ *                                 _("A file named “%s” already exists. Do you want to replace it?"),
+ *                                 filename);
+ *
+ *   adw_alert_dialog_add_responses (ADW_ALERT_DIALOG (dialog),
+ *                                   "cancel",  _("_Cancel"),
+ *                                   "replace", _("_Replace"),
+ *                                   NULL);
+ *
+ *   adw_alert_dialog_set_response_appearance (ADW_ALERT_DIALOG (dialog),
+ *                                             "replace",
+ *                                             ADW_RESPONSE_DESTRUCTIVE);
+ *
+ *   adw_alert_dialog_set_default_response (ADW_ALERT_DIALOG (dialog), "cancel");
+ *   adw_alert_dialog_set_close_response (ADW_ALERT_DIALOG (dialog), "cancel");
+ *
+ *   adw_alert_dialog_choose (ADW_ALERT_DIALOG (dialog), GTK_WIDGET (self),
+ *                            NULL, (GAsyncReadyCallback) dialog_cb, self);
+ * }
+ * ```
+ *
+ * ## AdwAlertDialog as GtkBuildable
+ *
+ * `AdwAlertDialog` supports adding responses in UI definitions by via the
+ * `<responses>` element that may contain multiple `<response>` elements, each
+ * representing a response.
+ *
+ * Each of the `<response>` elements must have the `id` attribute specifying the
+ * response ID. The contents of the element are used as the response label.
+ *
+ * Response labels can be translated with the usual `translatable`, `context`
+ * and `comments` attributes.
+ *
+ * The `<response>` elements can also have `enabled` and/or `appearance`
+ * attributes. See [`AlertDialog.set_response_enabled`](https://docs.gtk.org/alertdialog/method.set_response_enabled.html) and
+ * [`AlertDialog.set_response_appearance`](https://docs.gtk.org/alertdialog/method.set_response_appearance.html) for details.
+ *
+ * Example of an `AdwAlertDialog` UI definition:
+ *
+ * ```xml
+ * <object class="AdwAlertDialog" id="dialog">
+ *   <property name="heading" translatable="yes">Save Changes?</property>
+ *   <property name="body" translatable="yes">Open documents contain unsaved changes. Changes which are not saved will be permanently lost.</property>
+ *   <property name="default-response">save</property>
+ *   <property name="close-response">cancel</property>
+ *   <signal name="response" handler="response_cb"/>
+ *   <responses>
+ *     <response id="cancel" translatable="yes">_Cancel</response>
+ *     <response id="discard" translatable="yes" appearance="destructive">_Discard</response>
+ *     <response id="save" translatable="yes" appearance="suggested" enabled="false">_Save</response>
+ *   </responses>
+ * </object>
+ * ```
+ */
+export const AdwAlertDialog: (props: AdwAlertDialogProps) => ReactNode = createSlotWidget<AdwAlertDialogProps>("AdwAlertDialog", ["extraChild"]);
+
+/**
+ * A freeform application window.
+ *
+ * ![application-window](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/application-window.png)
+ *
+ * `AdwApplicationWindow` is a [`Gtk.ApplicationWindow`](https://docs.gtk.org/gtk4/class.ApplicationWindow.html) subclass providing
+ * the same features as [`Window`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.Window.html).
+ *
+ * See [`Window`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.Window.html) for details.
+ *
+ * Example of an `AdwApplicationWindow` UI definition:
+ *
+ * ```xml
+ * <object class="AdwApplicationWindow">
+ *   <property name="content">
+ *     <object class="AdwToolbarView">
+ *       <child type="top">
+ *         <object class="AdwHeaderBar"/>
+ *       </child>
+ *       <property name="content">
+ *         <!-- ... -->
+ *       </property>
+ *     </object>
+ *   </property>
+ * </object>
+ * ```
+ *
+ * Using [`Gtk.Application.menubar`](https://docs.gtk.org/gtk4/property.Application.menubar.html) is not supported and may result in
+ * visual glitches.
+ */
+export const AdwApplicationWindow: (props: AdwApplicationWindowProps) => ReactNode = createSlotWidget<AdwApplicationWindowProps>("AdwApplicationWindow", ["content"]);
+
+/**
+ * A bottom sheet with an optional bottom bar.
+ *
+ * ![bottom-sheet](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/bottom-sheet.png)
+ *
+ * `AdwBottomSheet` has three child widgets. [`BottomSheet.content`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.BottomSheet.content.html) is
+ * shown persistently. [`BottomSheet.sheet`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.BottomSheet.sheet.html) is displayed above it when
+ * it's open, and [`BottomSheet.bottom-bar`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.BottomSheet.bottom-bar.html) is displayed when it's not.
+ *
+ * Bottom sheet and bottom bar are attached to the bottom edge of the widget.
+ * They take the full width by default, but can only take a portion of it if
+ * [`BottomSheet.full-width`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.BottomSheet.full-width.html) is set to `FALSE`. In this case,
+ * [`BottomSheet.align`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.BottomSheet.align.html) determines where along the bottom edge they are
+ * placed.
+ *
+ * Bottom bar can be hidden using the [`BottomSheet.reveal-bottom-bar`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.BottomSheet.reveal-bottom-bar.html)
+ * property.
+ *
+ * `AdwBottomSheet` can be useful for applications such as music players, that
+ * want to have a persistent bottom bar that expands into a bottom sheet when
+ * clicked. It's meant for cases where a bottom sheet is tightly integrated into
+ * the UI. For more transient bottom sheets, see [`Dialog`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.Dialog.html).
+ *
+ * To open or close the bottom sheet, use the [`BottomSheet.open`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.BottomSheet.open.html)
+ * property.
+ *
+ * By default, the bottom sheet has an overlaid drag handle. It can be disabled
+ * by setting [`BottomSheet.show-drag-handle`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.BottomSheet.show-drag-handle.html) to `FALSE`. Note that the
+ * handle also controls whether the sheet can be dragged using a pointer.
+ *
+ * Bottom sheets are modal by default, meaning that the content is dimmed and
+ * cannot be accessed while the sheet is open. Set [`BottomSheet.modal`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.BottomSheet.modal.html)
+ * to `FALSE` if this behavior is unwanted.
+ *
+ * To disable user interactions for opening or closing the bottom sheet (such as
+ * swipes or clicking the bottom bar or close button), set
+ * [`BottomSheet.can-open`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.BottomSheet.can-open.html) or [`BottomSheet.can-close`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.BottomSheet.can-close.html) to
+ * `FALSE`.
+ *
+ * In some cases, particularly when using a full-width bottom bar, it may be
+ * necessary to shift [`BottomSheet.content`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.BottomSheet.content.html) upwards. Use the
+ * [`BottomSheet.bottom-bar-height`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.BottomSheet.bottom-bar-height.html) and
+ * [`BottomSheet.sheet-height`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.BottomSheet.sheet-height.html) for that.
+ *
+ * `AdwBottomSheet` is not adaptive, and for larger window sizes applications
+ * may want to replace it with another UI, such as a sidebar. This can be done
+ * using [`MultiLayoutView`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.MultiLayoutView.html).
+ *
+ * ## Sizing
+ *
+ * Unlike [`Dialog`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.Dialog.html) presented as a bottom sheet, `AdwBottomSheet` just
+ * follows the content's natural size, and it's up to the applications to make
+ * sure their content provides one. For example, when using
+ * [`Gtk.ScrolledWindow`](https://docs.gtk.org/gtk4/class.ScrolledWindow.html), make sure to set
+ * [`Gtk.ScrolledWindow.propagate-natural-height`](https://docs.gtk.org/gtk4/property.ScrolledWindow.propagate-natural-height.html) to `TRUE`.
+ *
+ * ## Header Bar Integration
+ *
+ * When placed inside an `AdwBottomSheet`, [`HeaderBar`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.HeaderBar.html) will not show the
+ * title when [`BottomSheet.show-drag-handle`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.BottomSheet.show-drag-handle.html) is `TRUE`, regardless of
+ * [`HeaderBar.show-title`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.HeaderBar.show-title.html). This only applies to the default title,
+ * titles set with [`HeaderBar.title-widget`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.HeaderBar.title-widget.html) will still be shown.
+ *
+ * ## `AdwBottomSheet` as `GtkBuildable`:
+ *
+ * The `AdwBottomSheet` implementation of the [`Gtk.Buildable`](https://docs.gtk.org/gtk4/iface.Buildable.html) interface
+ * supports setting the sheet widget by specifying “sheet” as the “type”
+ * attribute of a ``<child>`` element, and the bottom bar by specifying
+ * “bottom-bar”. Specifying “content” or omitting the child type results in
+ * setting the content child.
+ */
+export const AdwBottomSheet: (props: AdwBottomSheetProps) => ReactNode = createSlotWidget<AdwBottomSheetProps>("AdwBottomSheet", ["bottomBar","content","sheet"]);
+
+/**
+ * A [`Gtk.ListBoxRow`](https://docs.gtk.org/gtk4/class.ListBoxRow.html) with an embedded text entry.
+ *
+ * ![entry-row](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/entry-row.png)
+ *
+ * `AdwEntryRow` has a title that doubles as placeholder text. It shows an icon
+ * indicating that it's editable and can receive additional widgets before or
+ * after the editable part.
+ *
+ * If [`EntryRow.show-apply-button`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.EntryRow.show-apply-button.html) is set to `TRUE`, `AdwEntryRow` can
+ * show an apply button when editing its contents. This can be useful if
+ * changing its contents can result in an expensive operation, such as network
+ * activity.
+ *
+ * `AdwEntryRow` provides only minimal API and should be used with the
+ * [`Gtk.Editable`](https://docs.gtk.org/gtk4/iface.Editable.html) API.
+ *
+ * See also [`PasswordEntryRow`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.PasswordEntryRow.html).
+ *
+ * ## AdwEntryRow as GtkBuildable
+ *
+ * The `AdwEntryRow` implementation of the [`Gtk.Buildable`](https://docs.gtk.org/gtk4/iface.Buildable.html) interface
+ * supports adding a child at its end by specifying “suffix” or omitting the
+ * “type” attribute of a `<child>` element.
+ *
+ * It also supports adding a child as a prefix widget by specifying “prefix” as
+ * the “type” attribute of a `<child>` element.
+ *
+ * ## CSS nodes
+ *
+ * `AdwEntryRow` has a single CSS node with name `row` and the `.entry` style
+ * class.
+ */
+export const AdwEntryRow: ((props: AdwEntryRowProps) => ReactNode) & {
+    AddPrefix: (props: { children?: ReactNode }) => ReactNode;
+    AddSuffix: (props: { children?: ReactNode }) => ReactNode;
+} = Object.assign(createSlotWidget<AdwEntryRowProps>("AdwEntryRow", []), {
+    AddPrefix: createContainerSlotChild("addPrefix"),
+    AddSuffix: createContainerSlotChild("addSuffix"),
+});
+
+/**
+ * A [`Gtk.ListBoxRow`](https://docs.gtk.org/gtk4/class.ListBoxRow.html) used to reveal widgets.
+ *
+ * ![expander-row](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/expander-row.png)
+ *
+ * The `AdwExpanderRow` widget allows the user to reveal or hide widgets below
+ * it. It also allows the user to enable the expansion of the row, allowing to
+ * disable all that the row contains.
+ *
+ * ## AdwExpanderRow as GtkBuildable
+ *
+ * The `AdwExpanderRow` implementation of the [`Gtk.Buildable`](https://docs.gtk.org/gtk4/iface.Buildable.html) interface
+ * supports adding a child as an suffix widget by specifying “suffix” as the
+ * “type” attribute of a `<child>` element.
+ *
+ * It also supports adding it as a prefix widget by specifying “prefix” as the
+ * “type” attribute of a `<child>` element.
+ *
+ * ## CSS nodes
+ *
+ * `AdwExpanderRow` has a main CSS node with name `row` and the `.expander`
+ * style class. It has the `.empty` style class when it contains no children.
+ *
+ * It contains the subnodes `row.header` for its main embedded row,
+ * `list.nested` for the list it can expand, and `image.expander-row-arrow` for
+ * its arrow.
+ *
+ * ## Style classes
+ *
+ * `AdwExpanderRow` can use the `.`
+ * style class to emphasize the row subtitle instead of the row title, which is
+ * useful for displaying read-only properties.
+ *
+ * When used together with the `.monospace` style class, only the subtitle
+ * becomes monospace, not the title or any extra widgets.
+ */
+export const AdwExpanderRow: ((props: AdwExpanderRowProps) => ReactNode) & {
+    AddPrefix: (props: { children?: ReactNode }) => ReactNode;
+    AddSuffix: (props: { children?: ReactNode }) => ReactNode;
+    AddRow: (props: { children?: ReactNode }) => ReactNode;
+    AddAction: (props: { children?: ReactNode }) => ReactNode;
+} = Object.assign(createSlotWidget<AdwExpanderRowProps>("AdwExpanderRow", []), {
+    AddPrefix: createContainerSlotChild("addPrefix"),
+    AddSuffix: createContainerSlotChild("addSuffix"),
+    AddRow: createContainerSlotChild("addRow"),
+    AddAction: createContainerSlotChild("addAction"),
+});
+
+/**
+ * An adaptive container acting like a box or an overlay.
+ *
+ * ![flap-wide](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/flap-wide.png)
+ * ![flap-narrow](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/flap-narrow.png)
+ *
+ * The `AdwFlap` widget can display its children like a [`Gtk.Box`](https://docs.gtk.org/gtk4/class.Box.html) does or
+ * like a [`Gtk.Overlay`](https://docs.gtk.org/gtk4/class.Overlay.html) does, according to the
+ * [`Flap.fold-policy`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.Flap.fold-policy.html) value.
+ *
+ * `AdwFlap` has at most three children: [`Flap.content`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.Flap.content.html),
+ * [`Flap.flap`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.Flap.flap.html) and [`Flap.separator`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.Flap.separator.html). Content is the primary
+ * child, flap is displayed next to it when unfolded, or overlays it when
+ * folded. Flap can be shown or hidden by changing the
+ * [`Flap.reveal-flap`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.Flap.reveal-flap.html) value, as well as via swipe gestures if
+ * [`Flap.swipe-to-open`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.Flap.swipe-to-open.html) and/or [`Flap.swipe-to-close`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.Flap.swipe-to-close.html) are set
+ * to `TRUE`.
+ *
+ * Optionally, a separator can be provided, which would be displayed between
+ * the content and the flap when there's no shadow to separate them, depending
+ * on the transition type.
+ *
+ * [`Flap.flap`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.Flap.flap.html) is transparent by default; add the
+ * `.background` style class to it if this is
+ * unwanted.
+ *
+ * If [`Flap.modal`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.Flap.modal.html) is set to `TRUE`, content becomes completely
+ * inaccessible when the flap is revealed while folded.
+ *
+ * The position of the flap and separator children relative to the content is
+ * determined by orientation, as well as the [`Flap.flap-position`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.Flap.flap-position.html)
+ * value.
+ *
+ * Folding the flap will automatically hide the flap widget, and unfolding it
+ * will automatically reveal it. If this behavior is not desired, the
+ * [`Flap.locked`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.Flap.locked.html) property can be used to override it.
+ *
+ * Common use cases include sidebars, header bars that need to be able to
+ * overlap the window content (for example, in fullscreen mode) and bottom
+ * sheets.
+ *
+ * ## AdwFlap as GtkBuildable
+ *
+ * The `AdwFlap` implementation of the [`Gtk.Buildable`](https://docs.gtk.org/gtk4/iface.Buildable.html) interface supports
+ * setting the flap child by specifying “flap” as the “type” attribute of a
+ * ``<child>`` element, and separator by specifying “separator”. Specifying
+ * “content” child type or omitting it results in setting the content child.
+ *
+ * ## CSS nodes
+ *
+ * `AdwFlap` has a single CSS node with name `flap`. The node will get the style
+ * classes `.folded` when it is folded, and `.unfolded` when it's not.
+ */
+export const AdwFlap: (props: AdwFlapProps) => ReactNode = createSlotWidget<AdwFlapProps>("AdwFlap", ["content","flap","separator"]);
+
+/**
+ * A title bar widget.
+ *
+ * ![header-bar](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/header-bar.png)
+ *
+ * `AdwHeaderBar` is similar to [`Gtk.HeaderBar`](https://docs.gtk.org/gtk4/class.HeaderBar.html), but provides additional
+ * features compared to it. Refer to `GtkHeaderBar` for details. It is typically
+ * used as a top bar within [`ToolbarView`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.ToolbarView.html).
+ *
+ * ## Dialog Integration
+ *
+ * When placed inside an [`Dialog`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.Dialog.html), `AdwHeaderBar` will display the dialog
+ * title instead of window title. It will also adjust the decoration layout to
+ * ensure it always has a close button and nothing else. Set
+ * [`HeaderBar.show-start-title-buttons`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.HeaderBar.show-start-title-buttons.html) and
+ * [`HeaderBar.show-end-title-buttons`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.HeaderBar.show-end-title-buttons.html) to `FALSE` to remove it if it's
+ * unwanted.
+ *
+ * ## Navigation View Integration
+ *
+ * When placed inside an [`NavigationPage`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.NavigationPage.html), `AdwHeaderBar` will display the
+ * page title instead of window title.
+ *
+ * When used together with [`NavigationView`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.NavigationView.html) or [`NavigationSplitView`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.NavigationSplitView.html),
+ * it will also display a back button that can be used to go back to the previous
+ * page. The button also has a context menu, allowing to pop multiple pages at
+ * once, potentially across multiple navigation views.
+ *
+ * Set [`HeaderBar.show-back-button`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.HeaderBar.show-back-button.html) to `FALSE` to disable this behavior
+ * in rare scenarios where it's unwanted.
+ *
+ * ## Split View Integration
+ *
+ * When placed inside [`NavigationSplitView`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.NavigationSplitView.html) or [`OverlaySplitView`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.OverlaySplitView.html),
+ * `AdwHeaderBar` will automatically hide the title buttons other than at the
+ * edges of the window.
+ *
+ * ## Bottom Sheet Integration
+ *
+ * When played inside [`BottomSheet`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.BottomSheet.html), `AdwHeaderBar` will not show the title
+ * unless [`BottomSheet.show-drag-handle`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.BottomSheet.show-drag-handle.html) is set to `FALSE`, regardless
+ * of [`HeaderBar.show-title`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.HeaderBar.show-title.html). This only applies to the default title,
+ * titles set with [`HeaderBar.title-widget`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.HeaderBar.title-widget.html) will still be shown.
+ *
+ * ## Centering Policy
+ *
+ * [`HeaderBar.centering-policy`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.HeaderBar.centering-policy.html) allows to enforce strict centering of
+ * the title widget. This can be useful for entries inside [`Clamp`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.Clamp.html).
+ *
+ * ## Title Buttons
+ *
+ * Unlike `GtkHeaderBar`, `AdwHeaderBar` allows to toggle title button
+ * visibility for each side individually, using the
+ * [`HeaderBar.show-start-title-buttons`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.HeaderBar.show-start-title-buttons.html) and
+ * [`HeaderBar.show-end-title-buttons`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.HeaderBar.show-end-title-buttons.html) properties.
+ *
+ * ## CSS nodes
+ *
+ * ```
+ * headerbar
+ * ╰── windowhandle
+ *     ╰── box
+ *         ├── widget
+ *         │   ╰── box.start
+ *         │       ├── windowcontrols.start
+ *         │       ├── widget
+ *         │       │   ╰── [button.back]
+ *         │       ╰── [other children]
+ *         ├── widget
+ *         │   ╰── [Title Widget]
+ *         ╰── widget
+ *             ╰── box.end
+ *                 ├── [other children]
+ *                 ╰── windowcontrols.end
+ * ```
+ *
+ * `AdwHeaderBar`'s CSS node is called `headerbar`. It contains a `windowhandle`
+ * subnode, which contains a `box` subnode, which contains three `widget`
+ * subnodes at the start, center and end of the header bar. The start and end
+ * subnodes contain a `box` subnode with the `.start` and `.end` style classes
+ * respectively, and the center node contains a node that represents the title.
+ *
+ * Each of the boxes contains a `windowcontrols` subnode, see
+ * [`Gtk.WindowControls`](https://docs.gtk.org/gtk4/class.WindowControls.html) for details, as well as other children.
+ *
+ * When [`HeaderBar.show-back-button`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.HeaderBar.show-back-button.html) is `TRUE`, the start box also
+ * contains a node with the name `widget` that contains a node with the name
+ * `button` and `.back` style class.
+ *
+ * ## Accessibility
+ *
+ * `AdwHeaderBar` uses the `GTK_ACCESSIBLE_ROLE_GROUP` role.
+ */
+export const AdwHeaderBar: ((props: AdwHeaderBarProps) => ReactNode) & {
+    PackStart: (props: { children?: ReactNode }) => ReactNode;
+    PackEnd: (props: { children?: ReactNode }) => ReactNode;
+} = Object.assign(createSlotWidget<AdwHeaderBarProps>("AdwHeaderBar", ["titleWidget"]), {
+    PackStart: createContainerSlotChild("packStart"),
+    PackEnd: createContainerSlotChild("packEnd"),
+});
+
+/**
+ * A dialog presenting a message or a question.
+ *
+ * ![message-dialog](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/message-dialog.png)
+ *
+ * Message dialogs have a heading, a body, an optional child widget, and one or
+ * multiple responses, each presented as a button.
+ *
+ * Each response has a unique string ID, and a button label. Additionally, each
+ * response can be enabled or disabled, and can have a suggested or destructive
+ * appearance.
+ *
+ * When one of the responses is activated, or the dialog is closed, the
+ * [`MessageDialog.:response`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/signal.MessageDialog.response.html) signal will be emitted. This signal is
+ * detailed, and the detail, as well as the `response` parameter will be set to
+ * the ID of the activated response, or to the value of the
+ * [`MessageDialog.close-response`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.MessageDialog.close-response.html) property if the dialog had been
+ * closed without activating any of the responses.
+ *
+ * Response buttons can be presented horizontally or vertically depending on
+ * available space.
+ *
+ * When a response is activated, `AdwMessageDialog` is closed automatically.
+ *
+ * An example of using a message dialog:
+ *
+ * ```c
+ * GtkWidget *dialog;
+ *
+ * dialog = adw_message_dialog_new (parent, _("Replace File?"), NULL);
+ *
+ * adw_message_dialog_format_body (ADW_MESSAGE_DIALOG (dialog),
+ *                                 _("A file named “%s” already exists. Do you want to replace it?"),
+ *                                 filename);
+ *
+ * adw_message_dialog_add_responses (ADW_MESSAGE_DIALOG (dialog),
+ *                                   "cancel",  _("_Cancel"),
+ *                                   "replace", _("_Replace"),
+ *                                   NULL);
+ *
+ * adw_message_dialog_set_response_appearance (ADW_MESSAGE_DIALOG (dialog), "replace", ADW_RESPONSE_DESTRUCTIVE);
+ *
+ * adw_message_dialog_set_default_response (ADW_MESSAGE_DIALOG (dialog), "cancel");
+ * adw_message_dialog_set_close_response (ADW_MESSAGE_DIALOG (dialog), "cancel");
+ *
+ * g_signal_connect (dialog, "response", G_CALLBACK (response_cb), self);
+ *
+ * gtk_window_present (GTK_WINDOW (dialog));
+ * ```
+ *
+ * ## Async API
+ *
+ * `AdwMessageDialog` can also be used via the [`MessageDialog.choose`](https://docs.gtk.org/messagedialog/method.choose.html)
+ * method. This API follows the GIO async pattern, for example:
+ *
+ * ```c
+ * static void
+ * dialog_cb (AdwMessageDialog *dialog,
+ *            GAsyncResult     *result,
+ *            MyWindow         *self)
+ * {
+ *   const char *response = adw_message_dialog_choose_finish (dialog, result);
+ *
+ *   // ...
+ * }
+ *
+ * static void
+ * show_dialog (MyWindow *self)
+ * {
+ *   GtkWidget *dialog;
+ *
+ *   dialog = adw_message_dialog_new (GTK_WINDOW (self), _("Replace File?"), NULL);
+ *
+ *   adw_message_dialog_format_body (ADW_MESSAGE_DIALOG (dialog),
+ *                                   _("A file named “%s” already exists. Do you want to replace it?"),
+ *                                   filename);
+ *
+ *   adw_message_dialog_add_responses (ADW_MESSAGE_DIALOG (dialog),
+ *                                     "cancel",  _("_Cancel"),
+ *                                     "replace", _("_Replace"),
+ *                                     NULL);
+ *
+ *   adw_message_dialog_set_response_appearance (ADW_MESSAGE_DIALOG (dialog), "replace", ADW_RESPONSE_DESTRUCTIVE);
+ *
+ *   adw_message_dialog_set_default_response (ADW_MESSAGE_DIALOG (dialog), "cancel");
+ *   adw_message_dialog_set_close_response (ADW_MESSAGE_DIALOG (dialog), "cancel");
+ *
+ *   adw_message_dialog_choose (ADW_MESSAGE_DIALOG (dialog), NULL, (GAsyncReadyCallback) dialog_cb, self);
+ * }
+ * ```
+ *
+ * ## AdwMessageDialog as GtkBuildable
+ *
+ * `AdwMessageDialog` supports adding responses in UI definitions by via the
+ * `<responses>` element that may contain multiple `<response>` elements, each
+ * representing a response.
+ *
+ * Each of the `<response>` elements must have the `id` attribute specifying the
+ * response ID. The contents of the element are used as the response label.
+ *
+ * Response labels can be translated with the usual `translatable`, `context`
+ * and `comments` attributes.
+ *
+ * The `<response>` elements can also have `enabled` and/or `appearance`
+ * attributes. See [`MessageDialog.set_response_enabled`](https://docs.gtk.org/messagedialog/method.set_response_enabled.html) and
+ * [`MessageDialog.set_response_appearance`](https://docs.gtk.org/messagedialog/method.set_response_appearance.html) for details.
+ *
+ * Example of an `AdwMessageDialog` UI definition:
+ *
+ * ```xml
+ * <object class="AdwMessageDialog" id="dialog">
+ *   <property name="heading" translatable="yes">Save Changes?</property>
+ *   <property name="body" translatable="yes">Open documents contain unsaved changes. Changes which are not saved will be permanently lost.</property>
+ *   <property name="default-response">save</property>
+ *   <property name="close-response">cancel</property>
+ *   <signal name="response" handler="response_cb"/>
+ *   <responses>
+ *     <response id="cancel" translatable="yes">_Cancel</response>
+ *     <response id="discard" translatable="yes" appearance="destructive">_Discard</response>
+ *     <response id="save" translatable="yes" appearance="suggested" enabled="false">_Save</response>
+ *   </responses>
+ * </object>
+ * ```
+ *
+ * ## Accessibility
+ *
+ * `AdwMessageDialog` uses the `GTK_ACCESSIBLE_ROLE_DIALOG` role.
+ */
+export const AdwMessageDialog: (props: AdwMessageDialogProps) => ReactNode = createSlotWidget<AdwMessageDialogProps>("AdwMessageDialog", ["extraChild"]);
+
+/**
+ * A widget presenting sidebar and content side by side or as a navigation view.
+ *
+ * ![navigation-split-view](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/navigation-split-view.png)
+ * ![navigation-split-view-collapsed](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/navigation-split-view-collapsed.png)
+ *
+ * `AdwNavigationSplitView` has two [`NavigationPage`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.NavigationPage.html) children: sidebar and
+ * content, and displays them side by side.
+ *
+ * When [`NavigationSplitView.collapsed`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.NavigationSplitView.collapsed.html) is set to `TRUE`, it instead
+ * puts both children inside an [`NavigationView`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.NavigationView.html). The
+ * [`NavigationSplitView.show-content`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.NavigationSplitView.show-content.html) controls which child is visible
+ * while collapsed.
+ *
+ * See also [`OverlaySplitView`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.OverlaySplitView.html).
+ *
+ * `AdwNavigationSplitView` is typically used together with an [`Breakpoint`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.Breakpoint.html)
+ * setting the `collapsed` property to `TRUE` on small widths, as follows:
+ *
+ * ```xml
+ * <object class="AdwWindow">
+ *   <property name="width-request">280</property>
+ *   <property name="height-request">200</property>
+ *   <property name="default-width">800</property>
+ *   <property name="default-height">800</property>
+ *   <child>
+ *     <object class="AdwBreakpoint">
+ *       <condition>max-width: 400sp</condition>
+ *       <setter object="split_view" property="collapsed">True</setter>
+ *     </object>
+ *   </child>
+ *   <property name="content">
+ *     <object class="AdwNavigationSplitView" id="split_view">
+ *       <property name="sidebar">
+ *         <object class="AdwNavigationPage">
+ *           <property name="title" translatable="yes">Sidebar</property>
+ *           <property name="child">
+ *             <!-- ... -->
+ *           </property>
+ *         </object>
+ *       </property>
+ *       <property name="content">
+ *         <object class="AdwNavigationPage">
+ *           <property name="title" translatable="yes">Content</property>
+ *           <property name="child">
+ *             <!-- ... -->
+ *           </property>
+ *         </object>
+ *       </property>
+ *     </object>
+ *   </property>
+ * </object>
+ * ```
+ *
+ * ## Sizing
+ *
+ * When not collapsed, `AdwNavigationSplitView` changes the sidebar width
+ * depending on its own width.
+ *
+ * If possible, it tries to allocate a fraction of the total width, controlled
+ * with the [`NavigationSplitView.sidebar-width-fraction`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.NavigationSplitView.sidebar-width-fraction.html) property.
+ *
+ * The sidebar also has minimum and maximum sizes, controlled with the
+ * [`NavigationSplitView.min-sidebar-width`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.NavigationSplitView.min-sidebar-width.html) and
+ * [`NavigationSplitView.max-sidebar-width`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.NavigationSplitView.max-sidebar-width.html) properties.
+ *
+ * The minimum and maximum sizes are using the length unit specified with the
+ * [`NavigationSplitView.sidebar-width-unit`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.NavigationSplitView.sidebar-width-unit.html).
+ *
+ * By default, sidebar is using 25% of the total width, with 180sp as the
+ * minimum size and 280sp as the maximum size.
+ *
+ * ## Header Bar Integration
+ *
+ * When used inside `AdwNavigationSplitView`, [`HeaderBar`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.HeaderBar.html) will
+ * automatically hide the window buttons in the middle.
+ *
+ * When collapsed, it also displays a back button for the content widget, as
+ * well as the page titles. See [`NavigationView`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.NavigationView.html) documentation for details.
+ *
+ * ## Actions
+ *
+ * `AdwNavigationSplitView` defines the same actions as `AdwNavigationView`, but
+ * they can be used even when the split view is not collapsed:
+ *
+ * - `navigation.push` takes a string parameter specifying the tag of the page
+ * to push. If it matches the tag of the content widget, it sets
+ * [`NavigationSplitView.show-content`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.NavigationSplitView.show-content.html) to `TRUE`.
+ *
+ * - `navigation.pop` doesn't take any parameters and sets
+ * [`NavigationSplitView.show-content`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.NavigationSplitView.show-content.html) to `FALSE`.
+ *
+ * ## `AdwNavigationSplitView` as `GtkBuildable`
+ *
+ * The `AdwNavigationSplitView` implementation of the [`Gtk.Buildable`](https://docs.gtk.org/gtk4/iface.Buildable.html)
+ * interface supports setting the sidebar widget by specifying “sidebar” as the
+ * “type” attribute of a ``<child>`` element, Specifying “content” child type or
+ * omitting it results in setting the content widget.
+ *
+ * ## CSS nodes
+ *
+ * `AdwNavigationSplitView` has a single CSS node with the name
+ * `navigation-split-view`.
+ *
+ * When collapsed, it contains a child node with the name `navigation-view`
+ * containing both children.
+ *
+ * ```
+ * navigation-split-view
+ * ╰── navigation-view
+ *     ├── [sidebar child]
+ *     ╰── [content child]
+ * ```
+ *
+ * When not collapsed, it contains two nodes with the name `widget`, one with
+ * the `.sidebar-pane` style class, the other one with `.content-view` style
+ * class, containing the sidebar and content children respectively.
+ *
+ * ```
+ * navigation-split-view
+ * ├── widget.sidebar-pane
+ * │   ╰── [sidebar child]
+ * ╰── widget.content-pane
+ *     ╰── [content child]
+ * ```
+ *
+ * ## Accessibility
+ *
+ * `AdwNavigationSplitView` uses the `GTK_ACCESSIBLE_ROLE_GROUP` role.
+ */
+export const AdwNavigationSplitView: ((props: AdwNavigationSplitViewProps) => ReactNode) & {
+    Page: (props: NavigationSplitViewPageProps) => ReactNode;
+} = Object.assign(createSlotWidget<AdwNavigationSplitViewProps>("AdwNavigationSplitView", ["content","sidebar"]), {
+    Page: createNavigationPageChild<NavigationSplitViewPageProps>("AdwNavigationSplitView"),
+});
+
+/**
+ * A page-based navigation container.
+ *
+ * ![navigation-view](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/navigation-view.png)
+ *
+ * `AdwNavigationView` presents one child at a time, similar to
+ * [`Gtk.Stack`](https://docs.gtk.org/gtk4/class.Stack.html).
+ *
+ * `AdwNavigationView` can only contain [`NavigationPage`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.NavigationPage.html) children.
+ *
+ * It maintains a navigation stack that can be controlled with
+ * [`NavigationView.push`](https://docs.gtk.org/navigationview/method.push.html) and [`NavigationView.pop`](https://docs.gtk.org/navigationview/method.pop.html). The whole
+ * navigation stack can also be replaced using [`NavigationView.replace`](https://docs.gtk.org/navigationview/method.replace.html).
+ *
+ * `AdwNavigationView` allows to manage pages statically or dynamically.
+ *
+ * Static pages can be added using the [`NavigationView.add`](https://docs.gtk.org/navigationview/method.add.html) method. The
+ * `AdwNavigationView` will keep a reference to these pages, but they aren't
+ * accessible to the user until [`NavigationView.push`](https://docs.gtk.org/navigationview/method.push.html) is called (except
+ * for the first page, which is pushed automatically). Use the
+ * [`NavigationView.remove`](https://docs.gtk.org/navigationview/method.remove.html) method to remove them. This is useful for
+ * applications that have a small number of unique pages and just need
+ * navigation between them.
+ *
+ * Dynamic pages are automatically destroyed once they are popped off the
+ * navigation stack. To add a page like this, push it using the
+ * [`NavigationView.push`](https://docs.gtk.org/navigationview/method.push.html) method without calling
+ * [`NavigationView.add`](https://docs.gtk.org/navigationview/method.add.html) first.
+ *
+ * ## Tags
+ *
+ * Static pages, as well as any pages in the navigation stack, can be accessed
+ * by their [`NavigationPage.tag`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.NavigationPage.tag.html). For example,
+ * [`NavigationView.push_by_tag`](https://docs.gtk.org/navigationview/method.push_by_tag.html) can be used to push a static page that's
+ * not in the navigation stack without having to keep a reference to it manually.
+ *
+ * ## Header Bar Integration
+ *
+ * When used inside `AdwNavigationView`, [`HeaderBar`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.HeaderBar.html) will automatically
+ * display a back button that can be used to go back to the previous page when
+ * possible. The button also has a context menu, allowing to pop multiple pages
+ * at once, potentially across multiple navigation views.
+ *
+ * Set [`HeaderBar.show-back-button`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.HeaderBar.show-back-button.html) to `FALSE` to disable this behavior
+ * in rare scenarios where it's unwanted.
+ *
+ * `AdwHeaderBar` will also display the title of the `AdwNavigationPage` it's
+ * placed into, so most applications shouldn't need to customize it at all.
+ *
+ * ## Shortcuts and Gestures
+ *
+ * `AdwNavigationView` supports the following shortcuts for going to the
+ * previous page:
+ *
+ * - `Escape` (unless [`NavigationView.pop-on-escape`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.NavigationView.pop-on-escape.html) is set to
+ *   `FALSE`)
+ * - `Alt`+`←`
+ * - Back mouse button
+ *
+ * Additionally, it supports interactive gestures:
+ *
+ * - One-finger swipe towards the right on touchscreens
+ * - Scrolling towards the right on touchpads (usually two-finger swipe)
+ *
+ * These gestures have transitions enabled regardless of the
+ * [`NavigationView.animate-transitions`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.NavigationView.animate-transitions.html) value.
+ *
+ * Applications can also enable shortcuts for pushing another page onto the
+ * navigation stack via connecting to the [`NavigationView.:get-next-page`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/signal.NavigationView.get-next-page.html)
+ * signal, in that case the following shortcuts are supported:
+ *
+ * - `Alt`+`→`
+ * - Forward mouse button
+ * - Swipe/scrolling towards the left
+ *
+ * For right-to-left locales, the gestures and shortcuts are reversed.
+ *
+ * [`NavigationPage.can-pop`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.NavigationPage.can-pop.html) can be used to disable them, along with the
+ * header bar back buttons.
+ *
+ * ## Actions
+ *
+ * `AdwNavigationView` defines actions for controlling the navigation stack.
+ * actions for controlling the navigation stack:
+ *
+ * - `navigation.push` takes a string parameter specifying the tag of the page to
+ * push, and is equivalent to calling [`NavigationView.push_by_tag`](https://docs.gtk.org/navigationview/method.push_by_tag.html).
+ *
+ * - `navigation.pop` doesn't take any parameters and pops the current page from
+ * the navigation stack, equivalent to calling [`NavigationView.pop`](https://docs.gtk.org/navigationview/method.pop.html).
+ *
+ * ## `AdwNavigationView` as `GtkBuildable`
+ *
+ * `AdwNavigationView` allows to add pages as children, equivalent to using the
+ * [`NavigationView.add`](https://docs.gtk.org/navigationview/method.add.html) method.
+ *
+ * Example of an `AdwNavigationView` UI definition:
+ *
+ * ```xml
+ * <object class="AdwNavigationView">
+ *   <child>
+ *     <object class="AdwNavigationPage">
+ *       <property name="title" translatable="yes">Page 1</property>
+ *       <property name="child">
+ *         <object class="AdwToolbarView">
+ *           <child type="top">
+ *             <object class="AdwHeaderBar"/>
+ *           </child>
+ *           <property name="content">
+ *             <object class="GtkButton">
+ *               <property name="label" translatable="yes">Open Page 2</property>
+ *               <property name="halign">center</property>
+ *               <property name="valign">center</property>
+ *               <property name="action-name">navigation.push</property>
+ *               <property name="action-target">'page-2'</property>
+ *               <style>
+ *                 <class name="pill"/>
+ *                </style>
+ *             </object>
+ *           </property>
+ *         </object>
+ *       </property>
+ *     </object>
+ *   </child>
+ *   <child>
+ *     <object class="AdwNavigationPage">
+ *       <property name="title" translatable="yes">Page 2</property>
+ *       <property name="tag">page-2</property>
+ *       <property name="child">
+ *         <object class="AdwToolbarView">
+ *           <child type="top">
+ *             <object class="AdwHeaderBar"/>
+ *           </child>
+ *           <property name="content">
+ *             <!-- ... -->
+ *           </property>
+ *         </object>
+ *       </property>
+ *     </object>
+ *   </child>
+ * </object>
+ * ```
+ *
+ * ![navigation-view-example](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/navigation-view-example.png)
+ *
+ * ## CSS nodes
+ *
+ * `AdwNavigationView` has a single CSS node with the name `navigation-view`.
+ *
+ * ## Accessibility
+ *
+ * `AdwNavigationView` uses the `GTK_ACCESSIBLE_ROLE_GROUP` role.
+ */
+export const AdwNavigationView: ((props: AdwNavigationViewProps) => ReactNode) & {
+    Page: (props: NavigationViewPageProps) => ReactNode;
+} = Object.assign(createSlotWidget<AdwNavigationViewProps>("AdwNavigationView", []), {
+    Page: createNavigationPageChild<NavigationViewPageProps>("AdwNavigationView"),
+});
+
+/**
+ * A widget presenting sidebar and content side by side or as an overlay.
+ *
+ * ![overlay-split-view](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/overlay-split-view.png)
+ * ![overlay-split-view-collapsed](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/overlay-split-view-collapsed.png)
+ *
+ * `AdwOverlaySplitView` has two children: sidebar and content, and displays
+ * them side by side.
+ *
+ * When [`OverlaySplitView.collapsed`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.OverlaySplitView.collapsed.html) is set to `TRUE`, the sidebar is
+ * instead shown as an overlay above the content widget.
+ *
+ * The sidebar can be hidden or shown using the
+ * [`OverlaySplitView.show-sidebar`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.OverlaySplitView.show-sidebar.html) property.
+ *
+ * Sidebar can be displayed before or after the content, this can be controlled
+ * with the [`OverlaySplitView.sidebar-position`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.OverlaySplitView.sidebar-position.html) property.
+ *
+ * Collapsing the split view automatically hides the sidebar widget, and
+ * uncollapsing it shows the sidebar. If this behavior is not desired, the
+ * [`OverlaySplitView.pin-sidebar`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.OverlaySplitView.pin-sidebar.html) property can be used to override it.
+ *
+ * `AdwOverlaySplitView` supports an edge swipe gesture for showing the sidebar,
+ * and a swipe from the sidebar for hiding it. Gestures are only supported on
+ * touchscreen, but not touchpad. Gestures can be controlled with the
+ * [`OverlaySplitView.enable-show-gesture`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.OverlaySplitView.enable-show-gesture.html) and
+ * [`OverlaySplitView.enable-hide-gesture`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.OverlaySplitView.enable-hide-gesture.html) properties.
+ *
+ * See also [`NavigationSplitView`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.NavigationSplitView.html).
+ *
+ * `AdwOverlaySplitView` is typically used together with an [`Breakpoint`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.Breakpoint.html)
+ * setting the `collapsed` property to `TRUE` on small widths, as follows:
+ *
+ * ```xml
+ * <object class="AdwWindow">
+ *   <property name="default-width">800</property>
+ *   <property name="default-height">800</property>
+ *   <child>
+ *     <object class="AdwBreakpoint">
+ *       <condition>max-width: 400sp</condition>
+ *       <setter object="split_view" property="collapsed">True</setter>
+ *     </object>
+ *   </child>
+ *   <property name="content">
+ *     <object class="AdwOverlaySplitView" id="split_view">
+ *       <property name="sidebar">
+ *         <!-- ... -->
+ *       </property>
+ *       <property name="content">
+ *         <!-- ... -->
+ *       </property>
+ *     </object>
+ *   </property>
+ * </object>
+ * ```
+ *
+ * `AdwOverlaySplitView` is often used for implementing the
+ * utility pane
+ * pattern.
+ *
+ * ## Sizing
+ *
+ * When not collapsed, `AdwOverlaySplitView` changes the sidebar width
+ * depending on its own width.
+ *
+ * If possible, it tries to allocate a fraction of the total width, controlled
+ * with the [`OverlaySplitView.sidebar-width-fraction`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.OverlaySplitView.sidebar-width-fraction.html) property.
+ *
+ * The sidebar also has minimum and maximum sizes, controlled with the
+ * [`OverlaySplitView.min-sidebar-width`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.OverlaySplitView.min-sidebar-width.html) and
+ * [`OverlaySplitView.max-sidebar-width`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.OverlaySplitView.max-sidebar-width.html) properties.
+ *
+ * The minimum and maximum sizes are using the length unit specified with the
+ * [`OverlaySplitView.sidebar-width-unit`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.OverlaySplitView.sidebar-width-unit.html).
+ *
+ * By default, sidebar is using 25% of the total width, with 180sp as the
+ * minimum size and 280sp as the maximum size.
+ *
+ * When collapsed, the preferred width fraction is ignored and the sidebar uses
+ * [`OverlaySplitView.max-sidebar-width`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.OverlaySplitView.max-sidebar-width.html) when possible.
+ *
+ * ## Header Bar Integration
+ *
+ * When used inside `AdwOverlaySplitView`, [`HeaderBar`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.HeaderBar.html) will automatically
+ * hide the window buttons in the middle.
+ *
+ * ## `AdwOverlaySplitView` as `GtkBuildable`
+ *
+ * The `AdwOverlaySplitView` implementation of the [`Gtk.Buildable`](https://docs.gtk.org/gtk4/iface.Buildable.html)
+ * interface supports setting the sidebar widget by specifying “sidebar” as the
+ * “type” attribute of a ``<child>`` element, Specifying “content” child type or
+ * omitting it results in setting the content widget.
+ *
+ * ## CSS nodes
+ *
+ * `AdwOverlaySplitView` has a single CSS node with the name
+ * `overlay-split-view`.
+ *
+ * It contains two nodes with the name `widget`, containing the sidebar and
+ * content children.
+ *
+ * When not collapsed, they have the `.sidebar-view` and `.content-view` style
+ * classes respectively.
+ *
+ * ```
+ * overlay-split-view
+ * ├── widget.sidebar-pane
+ * │   ╰── [sidebar child]
+ * ╰── widget.content-pane
+ *     ╰── [content child]
+ * ```
+ *
+ * When collapsed, the one containing the sidebar child has the `.background`
+ * style class and the other one has no style classes.
+ *
+ * ```
+ * overlay-split-view
+ * ├── widget.background
+ * │   ╰── [sidebar child]
+ * ╰── widget
+ *     ╰── [content child]
+ * ```
+ *
+ * ## Accessibility
+ *
+ * `AdwOverlaySplitView` uses the `GTK_ACCESSIBLE_ROLE_GROUP` role.
+ */
+export const AdwOverlaySplitView: (props: AdwOverlaySplitViewProps) => ReactNode = createSlotWidget<AdwOverlaySplitViewProps>("AdwOverlaySplitView", ["content","sidebar"]);
+
+/**
+ * A group of preference rows.
+ *
+ * ![preferences-group](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/preferences-group.png)
+ *
+ * An `AdwPreferencesGroup` represents a group or tightly related preferences,
+ * which in turn are represented by [`PreferencesRow`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.PreferencesRow.html).
+ *
+ * To summarize the role of the preferences it gathers, a group can have both a
+ * title and a description. The title will be used by [`PreferencesDialog`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.PreferencesDialog.html)
+ * to let the user look for a preference.
+ *
+ * The [`PreferencesGroup.separate-rows`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.PreferencesGroup.separate-rows.html) property can be used to
+ * separate the rows within the group, same as when using the
+ * `.boxed-list-separate` style class
+ * instead of `.boxed-list`.
+ *
+ * ## AdwPreferencesGroup as GtkBuildable
+ *
+ * The `AdwPreferencesGroup` implementation of the [`Gtk.Buildable`](https://docs.gtk.org/gtk4/iface.Buildable.html) interface
+ * supports adding [`PreferencesRow`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.PreferencesRow.html)s to the list by omitting "type". If "type"
+ * is omitted and the widget isn't a [`PreferencesRow`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.PreferencesRow.html) the child is added to
+ * a box below the list.
+ *
+ * When the "type" attribute of a child is `header-suffix`, the child
+ * is set as the suffix on the end of the title and description.
+ *
+ * ## CSS nodes
+ *
+ * `AdwPreferencesGroup` has a single CSS node with name `preferencesgroup`.
+ *
+ * ## Accessibility
+ *
+ * `AdwPreferencesGroup` uses the `GTK_ACCESSIBLE_ROLE_GROUP` role.
+ */
+export const AdwPreferencesGroup: (props: AdwPreferencesGroupProps) => ReactNode = createSlotWidget<AdwPreferencesGroupProps>("AdwPreferencesGroup", ["headerSuffix"]);
+
+/**
+ * A page from [`PreferencesDialog`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.PreferencesDialog.html).
+ *
+ * ![preferences-page](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/preferences-page.png)
+ *
+ * The `AdwPreferencesPage` widget gathers preferences groups into a single page
+ * of a preferences window.
+ *
+ * ## CSS nodes
+ *
+ * `AdwPreferencesPage` has a single CSS node with name `preferencespage`.
+ *
+ * ## Accessibility
+ *
+ * `AdwPreferencesPage` uses the `GTK_ACCESSIBLE_ROLE_GROUP` role.
+ */
+export const AdwPreferencesPage: (props: AdwPreferencesPageProps) => ReactNode = createSlotWidget<AdwPreferencesPageProps>("AdwPreferencesPage", ["banner"]);
+
+/**
+ * A combined button and dropdown widget.
+ *
+ * ![split-button](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/split-button.png)
+ *
+ * `AdwSplitButton` is typically used to present a set of actions in a menu,
+ * but allow access to one of them with a single click.
+ *
+ * The API is very similar to [`Gtk.Button`](https://docs.gtk.org/gtk4/class.Button.html) and [`Gtk.MenuButton`](https://docs.gtk.org/gtk4/class.MenuButton.html), see
+ * their documentation for details.
+ *
+ * ## CSS nodes
+ *
+ * ```
+ * splitbutton[.image-button][.text-button]
+ * ├── button
+ * │   ╰── <content>
+ * ├── separator
+ * ╰── menubutton
+ *     ╰── button.toggle
+ *         ╰── arrow
+ * ```
+ *
+ * `AdwSplitButton`'s CSS node is called `splitbutton`. It contains the css
+ * nodes: `button`, `separator`, `menubutton`. See [`Gtk.MenuButton`](https://docs.gtk.org/gtk4/class.MenuButton.html)
+ * documentation for the `menubutton` contents.
+ *
+ * The main CSS node will contain the `.image-button` or `.text-button` style
+ * classes matching the button contents. The nested button nodes will never
+ * contain them.
+ *
+ * ## Style classes
+ *
+ * `AdwSplitButton` can use some of the same style classes as [`Gtk.Button`](https://docs.gtk.org/gtk4/class.Button.html):
+ *
+ * - `.suggested-action`
+ * - `.destructive-action`
+ * - `.flat`
+ * - `.raised`
+ *
+ * Other style classes, like `.pill`, cannot be used.
+ *
+ * ## Accessibility
+ *
+ * `AdwSplitButton` uses the `GTK_ACCESSIBLE_ROLE_GROUP` role.
+ */
+export const AdwSplitButton: (props: AdwSplitButtonProps) => ReactNode = createSlotWidget<AdwSplitButtonProps>("AdwSplitButton", ["popover"]);
+
+/**
+ * A tab bar for [`TabView`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.TabView.html).
+ *
+ * ![tab-bar](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/tab-bar.png)
+ *
+ * The `AdwTabBar` widget is a tab bar that can be used with conjunction with
+ * `AdwTabView`. It is typically used as a top bar within [`ToolbarView`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.ToolbarView.html).
+ *
+ * `AdwTabBar` can autohide and can optionally contain action widgets on both
+ * sides of the tabs.
+ *
+ * When there's not enough space to show all the tabs, `AdwTabBar` will scroll
+ * them. Pinned tabs always stay visible and aren't a part of the scrollable
+ * area.
+ *
+ * ## CSS nodes
+ *
+ * `AdwTabBar` has a single CSS node with name `tabbar`.
+ *
+ * ## Style classes
+ *
+ * By default `AdwTabBar` look like a part of an `AdwHeaderBar` and is intended
+ * to be used directly attached to one or used as a [`ToolbarView`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.ToolbarView.html) toolbar.
+ * The `.inline` style class removes its background,
+ * so that it can be used in different contexts instead.
+ *
+ * ![tab-bar-inline](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/tab-bar-inline.png)
+ */
+export const AdwTabBar: (props: AdwTabBarProps) => ReactNode = createSlotWidget<AdwTabBarProps>("AdwTabBar", ["endActionWidget","startActionWidget"]);
+
+/**
+ * A widget containing a page, as well as top and/or bottom bars.
+ *
+ * ![toolbar-view](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/toolbar-view.png)
+ *
+ * `AdwToolbarView` has a single content widget and one or multiple top and
+ * bottom bars, shown at the top and bottom sides respectively.
+ *
+ * Example of an `AdwToolbarView` UI definition:
+ * ```xml
+ * <object class="AdwToolbarView">
+ *   <child type="top">
+ *     <object class="AdwHeaderBar"/>
+ *   </child>
+ *   <property name="content">
+ *     <object class="AdwPreferencesPage">
+ *       <!-- ... -->
+ *     </object>
+ *   </property>
+ * </object>
+ * ```
+ *
+ * The following kinds of top and bottom bars are supported:
+ *
+ * - [`HeaderBar`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.HeaderBar.html)
+ * - [`TabBar`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.TabBar.html)
+ * - [`ViewSwitcherBar`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.ViewSwitcherBar.html)
+ * - [`Gtk.ActionBar`](https://docs.gtk.org/gtk4/class.ActionBar.html)
+ * - [`Gtk.HeaderBar`](https://docs.gtk.org/gtk4/class.HeaderBar.html)
+ * - [`Gtk.PopoverMenuBar`](https://docs.gtk.org/gtk4/class.PopoverMenuBar.html)
+ * - [`Gtk.SearchBar`](https://docs.gtk.org/gtk4/class.SearchBar.html)
+ * - Any [`Gtk.Box`](https://docs.gtk.org/gtk4/class.Box.html) or a similar widget with the
+ *   `.toolbar` style class
+ *
+ * By default, top and bottom bars are flat and scrolling content has a subtle
+ * undershoot shadow, same as when using the
+ * `.undershoot-top` and
+ * `.undershoot-bottom` style
+ * classes. This works well in most cases, e.g. with [`StatusPage`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.StatusPage.html) or
+ * [`PreferencesPage`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.PreferencesPage.html), where the background at the top and bottom parts of
+ * the page is uniform. Additionally, windows with sidebars should always use
+ * this style.
+ *
+ * [`ToolbarView.top-bar-style`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.ToolbarView.top-bar-style.html) and
+ * [`ToolbarView.bottom-bar-style`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.ToolbarView.bottom-bar-style.html) properties can be used add an opaque
+ * background and a persistent shadow to top and bottom bars, this can be useful
+ * for content such as utility panes,
+ * where some elements are adjacent to the top/bottom bars, or [`TabView`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.TabView.html),
+ * where each page can have a different background.
+ *
+ * ![toolbar-view-flat-1](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/toolbar-view-flat-1.png)
+ * ![toolbar-view-flat-2](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/toolbar-view-flat-2.png)
+ * ![toolbar-view-raised](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/toolbar-view-raised.png)
+ *
+ * `AdwToolbarView` ensures the top and bottom bars have consistent backdrop
+ * styles and vertical spacing. For comparison:
+ *
+ * ![toolbar-view-spacing](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/toolbar-view-spacing.png)
+ * ![toolbar-view-spacing-box](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/toolbar-view-spacing-box.png)
+ *
+ * Any top and bottom bars can also be dragged to move the window, equivalent
+ * to putting them into a [`Gtk.WindowHandle`](https://docs.gtk.org/gtk4/class.WindowHandle.html).
+ *
+ * Content is typically place between top and bottom bars, but can also extend
+ * behind them. This is controlled with the
+ * [`ToolbarView.extend-content-to-top-edge`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.ToolbarView.extend-content-to-top-edge.html) and
+ * [`ToolbarView.extend-content-to-bottom-edge`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.ToolbarView.extend-content-to-bottom-edge.html) properties.
+ *
+ * Top and bottom bars can be hidden and revealed with an animation using the
+ * [`ToolbarView.reveal-top-bars`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.ToolbarView.reveal-top-bars.html) and
+ * [`ToolbarView.reveal-bottom-bars`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.ToolbarView.reveal-bottom-bars.html) properties.
+ *
+ * ## `AdwToolbarView` as `GtkBuildable`
+ *
+ * The `AdwToolbarView` implementation of the [`Gtk.Buildable`](https://docs.gtk.org/gtk4/iface.Buildable.html) interface
+ * supports adding a top bar by specifying “top” as the “type” attribute of a
+ * ``<child>`` element, or adding a bottom bar by specifying “bottom”.
+ *
+ * ## Accessibility
+ *
+ * `AdwToolbarView` uses the `GTK_ACCESSIBLE_ROLE_GROUP` role.
+ */
+export const AdwToolbarView: ((props: AdwToolbarViewProps) => ReactNode) & {
+    AddTopBar: (props: { children?: ReactNode }) => ReactNode;
+    AddBottomBar: (props: { children?: ReactNode }) => ReactNode;
+} = Object.assign(createSlotWidget<AdwToolbarViewProps>("AdwToolbarView", ["content"]), {
+    AddTopBar: createContainerSlotChild("addTopBar"),
+    AddBottomBar: createContainerSlotChild("addBottomBar"),
+});
+
+/**
+ * A view container for [`ViewSwitcher`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.ViewSwitcher.html).
+ *
+ * `AdwViewStack` is a container which only shows one page at a time.
+ * It is typically used to hold an application's main views.
+ *
+ * It doesn't provide a way to transition between pages.
+ * Instead, a separate widget such as [`ViewSwitcher`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.ViewSwitcher.html) can be used with
+ * `AdwViewStack` to provide this functionality.
+ *
+ * `AdwViewStack` pages can have a title, an icon, an attention request, and a
+ * numbered badge that [`ViewSwitcher`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.ViewSwitcher.html) will use to let users identify which
+ * page is which. Set them using the [`ViewStackPage.title`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.ViewStackPage.title.html),
+ * [`ViewStackPage.icon-name`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.ViewStackPage.icon-name.html),
+ * [`ViewStackPage.needs-attention`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.ViewStackPage.needs-attention.html), and
+ * [`ViewStackPage.badge-number`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.ViewStackPage.badge-number.html) properties.
+ *
+ * Unlike [`Gtk.Stack`](https://docs.gtk.org/gtk4/class.Stack.html), transitions between views can only be animated via
+ * a crossfade and size changes are always interpolated. Animations are disabled
+ * by default. Use [`ViewStack.enable-transitions`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.ViewStack.enable-transitions.html) to enable them.
+ *
+ * `AdwViewStack` maintains a [`ViewStackPage`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.ViewStackPage.html) object for each added child,
+ * which holds additional per-child properties. You obtain the
+ * [`ViewStackPage`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.ViewStackPage.html) for a child with [`ViewStack.get_page`](https://docs.gtk.org/viewstack/method.get_page.html) and you
+ * can obtain a [`Gtk.SelectionModel`](https://docs.gtk.org/gtk4/iface.SelectionModel.html) containing all the pages with
+ * [`ViewStack.get_pages`](https://docs.gtk.org/viewstack/method.get_pages.html).
+ *
+ * ## AdwViewStack as GtkBuildable
+ *
+ * To set child-specific properties in a .ui file, create
+ * [`ViewStackPage`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.ViewStackPage.html) objects explicitly, and set the child widget as a
+ * property on it:
+ *
+ * ```xml
+ *   <object class="AdwViewStack" id="stack">
+ *     <child>
+ *       <object class="AdwViewStackPage">
+ *         <property name="name">overview</property>
+ *         <property name="title">Overview</property>
+ *         <property name="child">
+ *           <object class="AdwStatusPage">
+ *             <property name="title">Welcome!</property>
+ *           </object>
+ *         </property>
+ *       </object>
+ *     </child>
+ *   </object>
+ * ```
+ *
+ * ## CSS nodes
+ *
+ * `AdwViewStack` has a single CSS node named `stack`.
+ *
+ * ## Accessibility
+ *
+ * `AdwViewStack` uses the `GTK_ACCESSIBLE_ROLE_TAB_PANEL` for the stack pages
+ * which are the accessible parent objects of the child widgets.
+ */
+export const AdwViewStack: ((props: AdwViewStackProps) => ReactNode) & {
+    Page: (props: StackPageProps) => ReactNode;
+} = Object.assign(createSlotWidget<AdwViewStackProps>("AdwViewStack", []), {
+    Page: createVirtualChild<StackPageProps>("StackPage"),
+});
+
+/**
+ * A freeform window.
+ *
+ * ![window](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/window.png)
+ *
+ * The `AdwWindow` widget is a subclass of [`Gtk.Window`](https://docs.gtk.org/gtk4/class.Window.html) which has no
+ * titlebar area. Instead, [`ToolbarView`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.ToolbarView.html) can be used together with
+ * [`HeaderBar`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.HeaderBar.html) or [`Gtk.HeaderBar`](https://docs.gtk.org/gtk4/class.HeaderBar.html) as follows:
+ *
+ * ```xml
+ * <object class="AdwWindow">
+ *   <property name="content">
+ *     <object class="AdwToolbarView">
+ *       <child type="top">
+ *         <object class="AdwHeaderBar"/>
+ *       </child>
+ *       <property name="content">
+ *         <!-- ... -->
+ *       </property>
+ *     </object>
+ *   </property>
+ * </object>
+ * ```
+ *
+ * Using [`Gtk.Window.titlebar`](https://docs.gtk.org/gtk4/property.Window.titlebar.html) or [`Gtk.Window.child`](https://docs.gtk.org/gtk4/property.Window.child.html)
+ * is not supported and will result in a crash. Use [`Window.content`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.Window.content.html)
+ * instead.
+ *
+ * ## Dialogs
+ *
+ * `AdwWindow` can contain [`Dialog`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.Dialog.html). Use [`Dialog.present`](https://docs.gtk.org/dialog/method.present.html) with the
+ * window or a widget within a window to show a dialog.
+ *
+ * ## Breakpoints
+ *
+ * `AdwWindow` can be used with [`Breakpoint`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.Breakpoint.html) the same way as
+ * [`BreakpointBin`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/class.BreakpointBin.html). Refer to that widget's documentation for details.
+ *
+ * Example:
+ *
+ * ```xml
+ * <object class="AdwWindow">
+ *   <property name="content">
+ *     <object class="AdwToolbarView">
+ *       <child type="top">
+ *         <object class="AdwHeaderBar"/>
+ *       </child>
+ *       <property name="content">
+ *         <!-- ... -->
+ *       </property>
+ *       <child type="bottom">
+ *         <object class="GtkActionBar" id="bottom_bar">
+ *           <property name="revealed">True</property>
+ *           <property name="visible">False</property>
+ *         </object>
+ *       </child>
+ *     </object>
+ *   </property>
+ *   <child>
+ *     <object class="AdwBreakpoint">
+ *       <condition>max-width: 500px</condition>
+ *       <setter object="bottom_bar" property="visible">True</setter>
+ *     </object>
+ *   </child>
+ * </object>
+ * ```
+ *
+ * When breakpoints are used, the minimum size must be larger than the smallest
+ * UI state. `AdwWindow` defaults to the minimum size of 360×200 px. If that's
+ * too small, set the [`Gtk.Widget.width-request`](https://docs.gtk.org/gtk4/property.Widget.width-request.html) and
+ * [`Gtk.Widget.height-request`](https://docs.gtk.org/gtk4/property.Widget.height-request.html) properties manually.
+ *
+ * ## Adaptive Preview
+ *
+ * `AdwWindow` has a debug tool called adaptive preview. It can be opened from
+ * GTK Inspector or by pressing `Ctrl`+`Shift`+`M`,
+ * and controlled via the [`Window.adaptive-preview`](https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/property.Window.adaptive-preview.html) property.
+ */
+export const AdwWindow: (props: AdwWindowProps) => ReactNode = createSlotWidget<AdwWindowProps>("AdwWindow", ["content"]);
+
+/**
+ * Presents contextual actions.
+ *
+ * ![An example GtkActionBar](https://docs.gtk.org/gtk4/action-bar.png)
+ *
+ * `GtkActionBar` is expected to be displayed below the content and expand
+ * horizontally to fill the area.
+ *
+ * It allows placing children at the start or the end. In addition, it
+ * contains an internal centered box which is centered with respect to
+ * the full width of the box, even if the children at either side take
+ * up different amounts of space.
+ *
+ * # GtkActionBar as GtkBuildable
+ *
+ * The `GtkActionBar` implementation of the `GtkBuildable` interface supports
+ * adding children at the start or end sides by specifying “start” or “end” as
+ * the “type” attribute of a ``<child>`` element, or setting the center widget
+ * by specifying “center” value.
+ *
+ * # CSS nodes
+ *
+ * ```
+ * actionbar
+ * ╰── revealer
+ *     ╰── box
+ *         ├── box.start
+ *         │   ╰── [start children]
+ *         ├── [center widget]
+ *         ╰── box.end
+ *             ╰── [end children]
+ * ```
+ *
+ * A `GtkActionBar`'s CSS node is called `actionbar`. It contains a `revealer`
+ * subnode, which contains a `box` subnode, which contains two `box` subnodes at
+ * the start and end of the action bar, with `start` and `end` style classes
+ * respectively, as well as a center node that represents the center child.
+ *
+ * Each of the boxes contains children packed for that side.
+ */
+export const GtkActionBar: ((props: GtkActionBarProps) => ReactNode) & {
+    PackStart: (props: { children?: ReactNode }) => ReactNode;
+    PackEnd: (props: { children?: ReactNode }) => ReactNode;
+} = Object.assign(createSlotWidget<GtkActionBarProps>("GtkActionBar", []), {
+    PackStart: createContainerSlotChild("packStart"),
+    PackEnd: createContainerSlotChild("packEnd"),
+});
+
+/**
+ * Arranges three children in a row, keeping the middle child
+ * centered as well as possible.
+ *
+ * ![An example GtkCenterBox](https://docs.gtk.org/gtk4/centerbox.png)
+ *
+ * To add children to `GtkCenterBox`, use [`Gtk.CenterBox.set_start_widget`](https://docs.gtk.org/gtk4/method.CenterBox.set_start_widget.html),
+ * [`Gtk.CenterBox.set_center_widget`](https://docs.gtk.org/gtk4/method.CenterBox.set_center_widget.html) and
+ * [`Gtk.CenterBox.set_end_widget`](https://docs.gtk.org/gtk4/method.CenterBox.set_end_widget.html).
+ *
+ * The sizing and positioning of children can be influenced with the
+ * align and expand properties of the children.
+ *
+ * # GtkCenterBox as GtkBuildable
+ *
+ * The `GtkCenterBox` implementation of the `GtkBuildable` interface
+ * supports placing children in the 3 positions by specifying “start”, “center”
+ * or “end” as the “type” attribute of a ``<child>`` element.
+ *
+ * # CSS nodes
+ *
+ * `GtkCenterBox` uses a single CSS node with the name “box”,
+ *
+ * The first child of the `GtkCenterBox` will be allocated depending on the
+ * text direction, i.e. in left-to-right layouts it will be allocated on the
+ * left and in right-to-left layouts on the right.
+ *
+ * In vertical orientation, the nodes of the children are arranged from top to
+ * bottom.
+ *
+ * # Accessibility
+ *
+ * Until GTK 4.10, `GtkCenterBox` used the [`Gtk.AccessibleRole.group`](https://docs.gtk.org/gtk4/enum.AccessibleRole.group.html) role.
+ *
+ * Starting from GTK 4.12, `GtkCenterBox` uses the [`Gtk.AccessibleRole.generic`](https://docs.gtk.org/gtk4/enum.AccessibleRole.generic.html)
+ * role.
+ */
+export const GtkCenterBox: (props: GtkCenterBoxProps) => ReactNode = createSlotWidget<GtkCenterBoxProps>("GtkCenterBox", ["centerWidget","endWidget","startWidget"]);
+
+/**
+ * Allows the user to reveal or conceal a child widget.
+ *
+ * ![An example GtkExpander](https://docs.gtk.org/gtk4/expander.png)
+ *
+ * This is similar to the triangles used in a `GtkTreeView`.
+ *
+ * Normally you use an expander as you would use a frame; you create
+ * the child widget and use [`Gtk.Expander.set_child`](https://docs.gtk.org/gtk4/method.Expander.set_child.html) to add it
+ * to the expander. When the expander is toggled, it will take care of
+ * showing and hiding the child automatically.
+ *
+ * # Special Usage
+ *
+ * There are situations in which you may prefer to show and hide the
+ * expanded widget yourself, such as when you want to actually create
+ * the widget at expansion time. In this case, create a `GtkExpander`
+ * but do not add a child to it. The expander widget has an
+ * [`Gtk.Expander.expanded`](https://docs.gtk.org/gtk4/property.Expander.expanded.html) property which can be used to
+ * monitor its expansion state. You should watch this property with
+ * a signal connection as follows:
+ *
+ * ```c
+ * static void
+ * expander_callback (GObject    *object,
+ *                    GParamSpec *param_spec,
+ *                    gpointer    user_data)
+ * {
+ *   GtkExpander *expander;
+ *
+ *   expander = GTK_EXPANDER (object);
+ *
+ *   if (gtk_expander_get_expanded (expander))
+ *     {
+ *       // Show or create widgets
+ *     }
+ *   else
+ *     {
+ *       // Hide or destroy widgets
+ *     }
+ * }
+ *
+ * static void
+ * create_expander (void)
+ * {
+ *   GtkWidget *expander = gtk_expander_new_with_mnemonic ("_More Options");
+ *   g_signal_connect (expander, "notify::expanded",
+ *                     G_CALLBACK (expander_callback), NULL);
+ *
+ *   // ...
+ * }
+ * ```
+ *
+ * # GtkExpander as GtkBuildable
+ *
+ * An example of a UI definition fragment with GtkExpander:
+ *
+ * ```xml
+ * <object class="GtkExpander">
+ *   <property name="label-widget">
+ *     <object class="GtkLabel" id="expander-label"/>
+ *   </property>
+ *   <property name="child">
+ *     <object class="GtkEntry" id="expander-content"/>
+ *   </property>
+ * </object>
+ * ```
+ *
+ * # CSS nodes
+ *
+ * ```
+ * expander-widget
+ * ╰── box
+ *     ├── title
+ *     │   ├── expander
+ *     │   ╰── <label widget>
+ *     ╰── <child>
+ * ```
+ *
+ * `GtkExpander` has a main node `expander-widget`, and subnode `box` containing
+ * the title and child widget. The box subnode `title` contains node `expander`,
+ * i.e. the expand/collapse arrow; then the label widget if any. The arrow of an
+ * expander that is showing its child gets the `:checked` pseudoclass set on it.
+ *
+ * # Accessibility
+ *
+ * `GtkExpander` uses the [`Gtk.AccessibleRole.button`](https://docs.gtk.org/gtk4/enum.AccessibleRole.button.html) role.
+ */
+export const GtkExpander: (props: GtkExpanderProps) => ReactNode = createSlotWidget<GtkExpanderProps>("GtkExpander", ["labelWidget"]);
+
+/**
+ * Places its child widgets at fixed positions and with fixed sizes.
+ *
+ * `GtkFixed` performs no automatic layout management.
+ *
+ * For most applications, you should not use this container! It keeps
+ * you from having to learn about the other GTK containers, but it
+ * results in broken applications.  With `GtkFixed`, the following
+ * things will result in truncated text, overlapping widgets, and
+ * other display bugs:
+ *
+ * - Themes, which may change widget sizes.
+ *
+ * - Fonts other than the one you used to write the app will of course
+ *   change the size of widgets containing text; keep in mind that
+ *   users may use a larger font because of difficulty reading the
+ *   default, or they may be using a different OS that provides different fonts.
+ *
+ * - Translation of text into other languages changes its size. Also,
+ *   display of non-English text will use a different font in many
+ *   cases.
+ *
+ * In addition, `GtkFixed` does not pay attention to text direction and
+ * thus may produce unwanted results if your app is run under right-to-left
+ * languages such as Hebrew or Arabic. That is: normally GTK will order
+ * containers appropriately for the text direction, e.g. to put labels to
+ * the right of the thing they label when using an RTL language, but it can’t
+ * do that with `GtkFixed`. So if you need to reorder widgets depending on
+ * the text direction, you would need to manually detect it and adjust child
+ * positions accordingly.
+ *
+ * Finally, fixed positioning makes it kind of annoying to add/remove
+ * UI elements, since you have to reposition all the other elements. This
+ * is a long-term maintenance problem for your application.
+ *
+ * If you know none of these things are an issue for your application,
+ * and prefer the simplicity of `GtkFixed`, by all means use the
+ * widget. But you should be aware of the tradeoffs.
+ */
+export const GtkFixed: ((props: GtkFixedProps) => ReactNode) & {
+    Child: (props: FixedChildProps) => ReactNode;
+} = Object.assign(createSlotWidget<GtkFixedProps>("GtkFixed", []), {
+    Child: createVirtualChild<FixedChildProps>("FixedChild"),
+});
+
+/**
+ * Surrounds its child with a decorative frame and an optional label.
+ *
+ * ![An example GtkFrame](https://docs.gtk.org/gtk4/frame.png)
+ *
+ * If present, the label is drawn inside the top edge of the frame.
+ * The horizontal position of the label can be controlled with
+ * [`Gtk.Frame.set_label_align`](https://docs.gtk.org/gtk4/method.Frame.set_label_align.html).
+ *
+ * `GtkFrame` clips its child. You can use this to add rounded corners
+ * to widgets, but be aware that it also cuts off shadows.
+ *
+ * # GtkFrame as GtkBuildable
+ *
+ * An example of a UI definition fragment with GtkFrame:
+ *
+ * ```xml
+ * <object class="GtkFrame">
+ *   <property name="label-widget">
+ *     <object class="GtkLabel" id="frame_label"/>
+ *   </property>
+ *   <property name="child">
+ *     <object class="GtkEntry" id="frame_content"/>
+ *   </property>
+ * </object>
+ * ```
+ *
+ * # CSS nodes
+ *
+ * ```
+ * frame
+ * ├── <label widget>
+ * ╰── <child>
+ * ```
+ *
+ * `GtkFrame` has a main CSS node with name “frame”, which is used to draw the
+ * visible border. You can set the appearance of the border using CSS properties
+ * like “border-style” on this node.
+ *
+ * # Accessibility
+ *
+ * `GtkFrame` uses the [`Gtk.AccessibleRole.group`](https://docs.gtk.org/gtk4/enum.AccessibleRole.group.html) role.
+ */
+export const GtkFrame: (props: GtkFrameProps) => ReactNode = createSlotWidget<GtkFrameProps>("GtkFrame", ["labelWidget"]);
+
+/**
+ * Arranges its child widgets in rows and columns.
+ *
+ * ![An example GtkGrid](https://docs.gtk.org/gtk4/grid.png)
+ *
+ * It supports arbitrary positions and horizontal/vertical spans.
+ *
+ * Children are added using [`Gtk.Grid.attach`](https://docs.gtk.org/gtk4/method.Grid.attach.html). They can span multiple
+ * rows or columns. It is also possible to add a child next to an existing
+ * child, using [`Gtk.Grid.attach_next_to`](https://docs.gtk.org/gtk4/method.Grid.attach_next_to.html). To remove a child from the
+ * grid, use [`Gtk.Grid.remove`](https://docs.gtk.org/gtk4/method.Grid.remove.html).
+ *
+ * The behaviour of `GtkGrid` when several children occupy the same grid
+ * cell is undefined.
+ *
+ * # GtkGrid as GtkBuildable
+ *
+ * Every child in a `GtkGrid` has access to a custom [`Gtk.Buildable`](https://docs.gtk.org/gtk4/iface.Buildable.html)
+ * element, called `<layout>`. It can by used to specify a position in the
+ * grid and optionally spans. All properties that can be used in the `<layout>`
+ * element are implemented by [`Gtk.GridLayoutChild`](https://docs.gtk.org/gtk4/class.GridLayoutChild.html).
+ *
+ * It is implemented by `GtkWidget` using [`Gtk.LayoutManager`](https://docs.gtk.org/gtk4/class.LayoutManager.html).
+ *
+ * To showcase it, here is a simple example:
+ *
+ * ```xml
+ * <object class="GtkGrid" id="my_grid">
+ *   <child>
+ *     <object class="GtkButton" id="button1">
+ *       <property name="label">Button 1</property>
+ *       <layout>
+ *         <property name="column">0</property>
+ *         <property name="row">0</property>
+ *       </layout>
+ *     </object>
+ *   </child>
+ *   <child>
+ *     <object class="GtkButton" id="button2">
+ *       <property name="label">Button 2</property>
+ *       <layout>
+ *         <property name="column">1</property>
+ *         <property name="row">0</property>
+ *       </layout>
+ *     </object>
+ *   </child>
+ *   <child>
+ *     <object class="GtkButton" id="button3">
+ *       <property name="label">Button 3</property>
+ *       <layout>
+ *         <property name="column">2</property>
+ *         <property name="row">0</property>
+ *         <property name="row-span">2</property>
+ *       </layout>
+ *     </object>
+ *   </child>
+ *   <child>
+ *     <object class="GtkButton" id="button4">
+ *       <property name="label">Button 4</property>
+ *       <layout>
+ *         <property name="column">0</property>
+ *         <property name="row">1</property>
+ *         <property name="column-span">2</property>
+ *       </layout>
+ *     </object>
+ *   </child>
+ * </object>
+ * ```
+ *
+ * It organizes the first two buttons side-by-side in one cell each.
+ * The third button is in the last column but spans across two rows.
+ * This is defined by the `row-span` property. The last button is
+ * located in the second row and spans across two columns, which is
+ * defined by the `column-span` property.
+ *
+ * # CSS nodes
+ *
+ * `GtkGrid` uses a single CSS node with name `grid`.
+ *
+ * # Accessibility
+ *
+ * Until GTK 4.10, `GtkGrid` used the [`Gtk.AccessibleRole.group`](https://docs.gtk.org/gtk4/enum.AccessibleRole.group.html) role.
+ *
+ * Starting from GTK 4.12, `GtkGrid` uses the [`Gtk.AccessibleRole.generic`](https://docs.gtk.org/gtk4/enum.AccessibleRole.generic.html) role.
+ */
+export const GtkGrid: ((props: GtkGridProps) => ReactNode) & {
+    Child: (props: GridChildProps) => ReactNode;
+} = Object.assign(createSlotWidget<GtkGridProps>("GtkGrid", []), {
+    Child: createVirtualChild<GridChildProps>("GridChild"),
+});
+
+/**
+ * Creates a custom titlebar for a window.
+ *
+ * ![An example GtkHeaderBar](https://docs.gtk.org/gtk4/headerbar.png)
+ *
+ * `GtkHeaderBar` is similar to a horizontal `GtkCenterBox`. It allows
+ * children to be placed at the start or the end. In addition, it allows
+ * the window title to be displayed. The title will be centered with respect
+ * to the width of the box, even if the children at either side take up
+ * different amounts of space.
+ *
+ * `GtkHeaderBar` can add typical window frame controls, such as minimize,
+ * maximize and close buttons, or the window icon.
+ *
+ * For these reasons, `GtkHeaderBar` is the natural choice for use as the
+ * custom titlebar widget of a `GtkWindow` (see [`Gtk.Window.set_titlebar`](https://docs.gtk.org/gtk4/method.Window.set_titlebar.html)),
+ * as it gives features typical of titlebars while allowing the addition of
+ * child widgets.
+ *
+ * ## GtkHeaderBar as GtkBuildable
+ *
+ * The `GtkHeaderBar` implementation of the `GtkBuildable` interface supports
+ * adding children at the start or end sides by specifying “start” or “end” as
+ * the “type” attribute of a ``<child>`` element, or setting the title widget by
+ * specifying “title” value.
+ *
+ * By default the `GtkHeaderBar` uses a `GtkLabel` displaying the title of the
+ * window it is contained in as the title widget, equivalent to the following
+ * UI definition:
+ *
+ * ```xml
+ * <object class="GtkHeaderBar">
+ *   <property name="title-widget">
+ *     <object class="GtkLabel">
+ *       <property name="label" translatable="yes">Label</property>
+ *       <property name="single-line-mode">True</property>
+ *       <property name="ellipsize">end</property>
+ *       <property name="width-chars">5</property>
+ *       <style>
+ *         <class name="title"/>
+ *       </style>
+ *     </object>
+ *   </property>
+ * </object>
+ * ```
+ *
+ * # CSS nodes
+ *
+ * ```
+ * headerbar
+ * ╰── windowhandle
+ *     ╰── box
+ *         ├── box.start
+ *         │   ├── windowcontrols.start
+ *         │   ╰── [other children]
+ *         ├── [Title Widget]
+ *         ╰── box.end
+ *             ├── [other children]
+ *             ╰── windowcontrols.end
+ * ```
+ *
+ * A `GtkHeaderBar`'s CSS node is called `headerbar`. It contains a `windowhandle`
+ * subnode, which contains a `box` subnode, which contains two `box` subnodes at
+ * the start and end of the header bar, as well as a center node that represents
+ * the title.
+ *
+ * Each of the boxes contains a `windowcontrols` subnode, see
+ * [`Gtk.WindowControls`](https://docs.gtk.org/gtk4/class.WindowControls.html) for details, as well as other children.
+ *
+ * # Accessibility
+ *
+ * `GtkHeaderBar` uses the [`Gtk.AccessibleRole.group`](https://docs.gtk.org/gtk4/enum.AccessibleRole.group.html) role.
+ */
+export const GtkHeaderBar: ((props: GtkHeaderBarProps) => ReactNode) & {
+    PackStart: (props: { children?: ReactNode }) => ReactNode;
+    PackEnd: (props: { children?: ReactNode }) => ReactNode;
+} = Object.assign(createSlotWidget<GtkHeaderBarProps>("GtkHeaderBar", ["titleWidget"]), {
+    PackStart: createContainerSlotChild("packStart"),
+    PackEnd: createContainerSlotChild("packEnd"),
+});
+
+/**
+ * Displays a popup when clicked.
+ *
+ * ![An example GtkMenuButton](https://docs.gtk.org/gtk4/menu-button.png)
+ *
+ * This popup can be provided either as a `GtkPopover` or as an abstract
+ * `GMenuModel`.
+ *
+ * The `GtkMenuButton` widget can show either an icon (set with the
+ * [`Gtk.MenuButton.icon-name`](https://docs.gtk.org/gtk4/property.MenuButton.icon-name.html) property) or a label (set with the
+ * [`Gtk.MenuButton.label`](https://docs.gtk.org/gtk4/property.MenuButton.label.html) property). If neither is explicitly set,
+ * a [`Gtk.Image`](https://docs.gtk.org/gtk4/class.Image.html) is automatically created, using an arrow image oriented
+ * according to [`Gtk.MenuButton.direction`](https://docs.gtk.org/gtk4/property.MenuButton.direction.html) or the generic
+ * “open-menu-symbolic” icon if the direction is not set.
+ *
+ * The positioning of the popup is determined by the
+ * [`Gtk.MenuButton.direction`](https://docs.gtk.org/gtk4/property.MenuButton.direction.html) property of the menu button.
+ *
+ * For menus, the [`Gtk.Widget.halign`](https://docs.gtk.org/gtk4/property.Widget.halign.html) and [`Gtk.Widget.valign`](https://docs.gtk.org/gtk4/property.Widget.valign.html)
+ * properties of the menu are also taken into account. For example, when the
+ * direction is %GTK_ARROW_DOWN and the horizontal alignment is %GTK_ALIGN_START,
+ * the menu will be positioned below the button, with the starting edge
+ * (depending on the text direction) of the menu aligned with the starting
+ * edge of the button. If there is not enough space below the button, the
+ * menu is popped up above the button instead. If the alignment would move
+ * part of the menu offscreen, it is “pushed in”.
+ *
+ * |           | start                | center                | end                |
+ * | -         | ---                  | ---                   | ---                |
+ * | **down**  | ![](https://docs.gtk.org/gtk4/down-start.png)  | ![](https://docs.gtk.org/gtk4/down-center.png)  | ![](https://docs.gtk.org/gtk4/down-end.png)  |
+ * | **up**    | ![](https://docs.gtk.org/gtk4/up-start.png)    | ![](https://docs.gtk.org/gtk4/up-center.png)    | ![](https://docs.gtk.org/gtk4/up-end.png)    |
+ * | **left**  | ![](https://docs.gtk.org/gtk4/left-start.png)  | ![](https://docs.gtk.org/gtk4/left-center.png)  | ![](https://docs.gtk.org/gtk4/left-end.png)  |
+ * | **right** | ![](https://docs.gtk.org/gtk4/right-start.png) | ![](https://docs.gtk.org/gtk4/right-center.png) | ![](https://docs.gtk.org/gtk4/right-end.png) |
+ *
+ * # CSS nodes
+ *
+ * ```
+ * menubutton
+ * ╰── button.toggle
+ *     ╰── <content>
+ *          ╰── [arrow]
+ * ```
+ *
+ * `GtkMenuButton` has a single CSS node with name `menubutton`
+ * which contains a `button` node with a `.toggle` style class.
+ *
+ * If the button contains an icon, it will have the `.image-button` style class,
+ * if it contains text, it will have `.text-button` style class. If an arrow is
+ * visible in addition to an icon, text or a custom child, it will also have
+ * `.arrow-button` style class.
+ *
+ * Inside the toggle button content, there is an `arrow` node for
+ * the indicator, which will carry one of the `.none`, `.up`, `.down`,
+ * `.left` or `.right` style classes to indicate the direction that
+ * the menu will appear in. The CSS is expected to provide a suitable
+ * image for each of these cases using the `-gtk-icon-source` property.
+ *
+ * Optionally, the `menubutton` node can carry the `.circular` style class
+ * to request a round appearance.
+ *
+ * # Accessibility
+ *
+ * `GtkMenuButton` uses the [`Gtk.AccessibleRole.button`](https://docs.gtk.org/gtk4/enum.AccessibleRole.button.html) role.
+ */
+export const GtkMenuButton: ((props: GtkMenuButtonProps) => ReactNode) & {
+    MenuItem: (props: MenuItemProps) => ReactNode;
+    MenuSection: (props: MenuSectionProps) => ReactNode;
+    MenuSubmenu: (props: MenuSubmenuProps) => ReactNode;
+} = Object.assign(createSlotWidget<GtkMenuButtonProps>("GtkMenuButton", ["popover"]), {
+    MenuItem: createMenuChild<MenuItemProps>("MenuItem"),
+    MenuSection: createMenuChild<MenuSectionProps>("MenuSection"),
+    MenuSubmenu: createMenuChild<MenuSubmenuProps>("MenuSubmenu"),
+});
+
+/**
+ * Switches between children using tabs.
+ *
+ * ![An example GtkNotebook](https://docs.gtk.org/gtk4/notebook.png)
+ *
+ * There are many configuration options for `GtkNotebook`. Among
+ * other things, you can choose on which edge the tabs appear
+ * (see [`Gtk.Notebook.set_tab_pos`](https://docs.gtk.org/gtk4/method.Notebook.set_tab_pos.html)), whether, if there are
+ * too many tabs to fit the notebook should be made bigger or scrolling
+ * arrows added (see [`Gtk.Notebook.set_scrollable`](https://docs.gtk.org/gtk4/method.Notebook.set_scrollable.html)), and whether
+ * there will be a popup menu allowing the users to switch pages.
+ * (see [`Gtk.Notebook.popup_enable`](https://docs.gtk.org/gtk4/method.Notebook.popup_enable.html)).
+ *
+ * # GtkNotebook as GtkBuildable
+ *
+ * The `GtkNotebook` implementation of the `GtkBuildable` interface
+ * supports placing children into tabs by specifying “tab” as the
+ * “type” attribute of a ``<child>`` element. Note that the content
+ * of the tab must be created before the tab can be filled.
+ * A tab child can be specified without specifying a ``<child>``
+ * type attribute.
+ *
+ * To add a child widget in the notebooks action area, specify
+ * "action-start" or “action-end” as the “type” attribute of the
+ * ``<child>`` element.
+ *
+ * An example of a UI definition fragment with `GtkNotebook`:
+ *
+ * ```xml
+ * <object class="GtkNotebook">
+ *   <child>
+ *     <object class="GtkLabel" id="notebook-content">
+ *       <property name="label">Content</property>
+ *     </object>
+ *   </child>
+ *   <child type="tab">
+ *     <object class="GtkLabel" id="notebook-tab">
+ *       <property name="label">Tab</property>
+ *     </object>
+ *   </child>
+ * </object>
+ * ```
+ *
+ * # Shortcuts and Gestures
+ *
+ * `GtkNotebook` supports the following keyboard shortcuts:
+ *
+ * - `Shift`+`F10` or `Menu` opens the context menu.
+ * - `Home` moves the focus to the first tab.
+ * - `End` moves the focus to the last tab.
+ *
+ * Additionally, the following signals have default keybindings:
+ *
+ * - [`Gtk.Notebook.:change-current-page`](https://docs.gtk.org/gtk4/signal.Notebook.change-current-page.html)
+ * - [`Gtk.Notebook.:focus-tab`](https://docs.gtk.org/gtk4/signal.Notebook.focus-tab.html)
+ * - [`Gtk.Notebook.:move-focus-out`](https://docs.gtk.org/gtk4/signal.Notebook.move-focus-out.html)
+ * - [`Gtk.Notebook.:reorder-tab`](https://docs.gtk.org/gtk4/signal.Notebook.reorder-tab.html)
+ * - [`Gtk.Notebook.:select-page`](https://docs.gtk.org/gtk4/signal.Notebook.select-page.html)
+ *
+ * Tabs support drag-and-drop between notebooks sharing the same `group-name`,
+ * or to new windows by handling the `::create-window` signal.
+ *
+ * # Actions
+ *
+ * `GtkNotebook` defines a set of built-in actions:
+ *
+ * - `menu.popup` opens the tabs context menu.
+ *
+ * # CSS nodes
+ *
+ * ```
+ * notebook
+ * ├── header.top
+ * │   ├── [<action widget>]
+ * │   ├── tabs
+ * │   │   ├── [arrow]
+ * │   │   ├── tab
+ * │   │   │   ╰── <tab label>
+ * ┊   ┊   ┊
+ * │   │   ├── tab[.reorderable-page]
+ * │   │   │   ╰── <tab label>
+ * │   │   ╰── [arrow]
+ * │   ╰── [<action widget>]
+ * │
+ * ╰── stack
+ *     ├── <child>
+ *     ┊
+ *     ╰── <child>
+ * ```
+ *
+ * `GtkNotebook` has a main CSS node with name `notebook`, a subnode
+ * with name `header` and below that a subnode with name `tabs` which
+ * contains one subnode per tab with name `tab`.
+ *
+ * If action widgets are present, their CSS nodes are placed next
+ * to the `tabs` node. If the notebook is scrollable, CSS nodes with
+ * name `arrow` are placed as first and last child of the `tabs` node.
+ *
+ * The main node gets the `.frame` style class when the notebook
+ * has a border (see [`Gtk.Notebook.set_show_border`](https://docs.gtk.org/gtk4/method.Notebook.set_show_border.html)).
+ *
+ * The header node gets one of the style class `.top`, `.bottom`,
+ * `.left` or `.right`, depending on where the tabs are placed. For
+ * reorderable pages, the tab node gets the `.reorderable-page` class.
+ *
+ * A `tab` node gets the `.dnd` style class while it is moved with drag-and-drop.
+ *
+ * The nodes are always arranged from left-to-right, regardless of text direction.
+ *
+ * # Accessibility
+ *
+ * `GtkNotebook` uses the following roles:
+ *
+ *  - [`Gtk.AccessibleRole.group`](https://docs.gtk.org/gtk4/enum.AccessibleRole.group.html) for the notebook widget
+ *  - [`Gtk.AccessibleRole.tab_list`](https://docs.gtk.org/gtk4/enum.AccessibleRole.tab_list.html) for the list of tabs
+ *  - [`Gtk.AccessibleRole.tab`](https://docs.gtk.org/gtk4/enum.AccessibleRole.tab.html) role for each tab
+ *  - [`Gtk.AccessibleRole.tab_panel`](https://docs.gtk.org/gtk4/enum.AccessibleRole.tab_panel.html) for each page
+ */
+export const GtkNotebook: ((props: GtkNotebookProps) => ReactNode) & {
+    Page: (props: NotebookPageProps) => ReactNode;
+    PageTab: (props: NotebookPageTabProps) => ReactNode;
+} = Object.assign(createSlotWidget<GtkNotebookProps>("GtkNotebook", []), {
+    Page: createVirtualChild<NotebookPageProps>("NotebookPage"),
+    PageTab: createVirtualChild<NotebookPageTabProps>("NotebookPageTab"),
+});
+
+/**
+ * Places “overlay” widgets on top of a single main child.
+ *
+ * ![An example GtkOverlay](https://docs.gtk.org/gtk4/overlay.png)
+ *
+ * The position of each overlay widget is determined by its
+ * [`Gtk.Widget.halign`](https://docs.gtk.org/gtk4/property.Widget.halign.html) and [`Gtk.Widget.valign`](https://docs.gtk.org/gtk4/property.Widget.valign.html)
+ * properties. E.g. a widget with both alignments set to %GTK_ALIGN_START
+ * will be placed at the top left corner of the `GtkOverlay` container,
+ * whereas an overlay with halign set to %GTK_ALIGN_CENTER and valign set
+ * to %GTK_ALIGN_END will be placed a the bottom edge of the `GtkOverlay`,
+ * horizontally centered. The position can be adjusted by setting the margin
+ * properties of the child to non-zero values.
+ *
+ * More complicated placement of overlays is possible by connecting
+ * to the [`Gtk.Overlay.:get-child-position`](https://docs.gtk.org/gtk4/signal.Overlay.get-child-position.html) signal.
+ *
+ * An overlay’s minimum and natural sizes are those of its main child.
+ * The sizes of overlay children are not considered when measuring these
+ * preferred sizes.
+ *
+ * # GtkOverlay as GtkBuildable
+ *
+ * The `GtkOverlay` implementation of the `GtkBuildable` interface
+ * supports placing a child as an overlay by specifying “overlay” as
+ * the “type” attribute of a ``<child>`` element.
+ *
+ * # CSS nodes
+ *
+ * `GtkOverlay` has a single CSS node with the name “overlay”. Overlay children
+ * whose alignments cause them to be positioned at an edge get the style classes
+ * “.left”, “.right”, “.top”, and/or “.bottom” according to their position.
+ */
+export const GtkOverlay: ((props: GtkOverlayProps) => ReactNode) & {
+    Child: (props: OverlayChildProps) => ReactNode;
+} = Object.assign(createSlotWidget<GtkOverlayProps>("GtkOverlay", []), {
+    Child: createVirtualChild<OverlayChildProps>("OverlayChild"),
+});
+
+/**
+ * Arranges its children in two panes, horizontally or vertically.
+ *
+ * ![An example GtkPaned](https://docs.gtk.org/gtk4/panes.png)
+ *
+ * The division between the two panes is adjustable by the user
+ * by dragging a handle.
+ *
+ * Child widgets are added to the panes of the widget with
+ * [`Gtk.Paned.set_start_child`](https://docs.gtk.org/gtk4/method.Paned.set_start_child.html) and [`Gtk.Paned.set_end_child`](https://docs.gtk.org/gtk4/method.Paned.set_end_child.html).
+ * The division between the two children is set by default from the size
+ * requests of the children, but it can be adjusted by the user.
+ *
+ * A paned widget draws a separator between the two child widgets and a
+ * small handle that the user can drag to adjust the division. It does not
+ * draw any relief around the children or around the separator. (The space
+ * in which the separator is called the gutter.) Often, it is useful to put
+ * each child inside a [`Gtk.Frame`](https://docs.gtk.org/gtk4/class.Frame.html) so that the gutter appears as a
+ * ridge. No separator is drawn if one of the children is missing.
+ *
+ * Each child has two options that can be set, "resize" and "shrink". If
+ * "resize" is true then, when the `GtkPaned` is resized, that child will
+ * expand or shrink along with the paned widget. If "shrink" is true, then
+ * that child can be made smaller than its requisition by the user.
+ * Setting "shrink" to false allows the application to set a minimum size.
+ * If "resize" is false for both children, then this is treated as if
+ * "resize" is true for both children.
+ *
+ * The application can set the position of the slider as if it were set
+ * by the user, by calling [`Gtk.Paned.set_position`](https://docs.gtk.org/gtk4/method.Paned.set_position.html).
+ *
+ * # Shortcuts and Gestures
+ *
+ * The following signals have default keybindings:
+ *
+ * - [`Gtk.Paned.:accept-position`](https://docs.gtk.org/gtk4/signal.Paned.accept-position.html)
+ * - [`Gtk.Paned.:cancel-position`](https://docs.gtk.org/gtk4/signal.Paned.cancel-position.html)
+ * - [`Gtk.Paned.:cycle-child-focus`](https://docs.gtk.org/gtk4/signal.Paned.cycle-child-focus.html)
+ * - [`Gtk.Paned.:cycle-handle-focus`](https://docs.gtk.org/gtk4/signal.Paned.cycle-handle-focus.html)
+ * - [`Gtk.Paned.:move-handle`](https://docs.gtk.org/gtk4/signal.Paned.move-handle.html)
+ * - [`Gtk.Paned.:toggle-handle-focus`](https://docs.gtk.org/gtk4/signal.Paned.toggle-handle-focus.html)
+ *
+ * # CSS nodes
+ *
+ * ```
+ * paned
+ * ├── <child>
+ * ├── separator[.wide]
+ * ╰── <child>
+ * ```
+ *
+ * `GtkPaned` has a main CSS node with name paned, and a subnode for
+ * the separator with name separator. The subnode gets a .wide style
+ * class when the paned is supposed to be wide.
+ *
+ * In horizontal orientation, the nodes are arranged based on the text
+ * direction, so in left-to-right mode, :first-child will select the
+ * leftmost child, while it will select the rightmost child in
+ * RTL layouts.
+ *
+ * ## Creating a paned widget with minimum sizes.
+ *
+ * ```c
+ * GtkWidget *hpaned = gtk_paned_new (GTK_ORIENTATION_HORIZONTAL);
+ * GtkWidget *frame1 = gtk_frame_new (NULL);
+ * GtkWidget *frame2 = gtk_frame_new (NULL);
+ *
+ * gtk_widget_set_size_request (hpaned, 200, -1);
+ *
+ * gtk_paned_set_start_child (GTK_PANED (hpaned), frame1);
+ * gtk_paned_set_resize_start_child (GTK_PANED (hpaned), TRUE);
+ * gtk_paned_set_shrink_start_child (GTK_PANED (hpaned), FALSE);
+ * gtk_widget_set_size_request (frame1, 50, -1);
+ *
+ * gtk_paned_set_end_child (GTK_PANED (hpaned), frame2);
+ * gtk_paned_set_resize_end_child (GTK_PANED (hpaned), FALSE);
+ * gtk_paned_set_shrink_end_child (GTK_PANED (hpaned), FALSE);
+ * gtk_widget_set_size_request (frame2, 50, -1);
+ * ```
+ */
+export const GtkPaned: (props: GtkPanedProps) => ReactNode = createSlotWidget<GtkPanedProps>("GtkPaned", ["endChild","startChild"]);
+
+/**
+ * A subclass of `GtkPopover` that implements menu behavior.
+ *
+ * ![An example GtkPopoverMenu](https://docs.gtk.org/gtk4/menu.png)
+ *
+ * `GtkPopoverMenu` treats its children like menus and allows switching
+ * between them. It can open submenus as traditional, nested submenus,
+ * or in a more touch-friendly sliding fashion.
+ * The property [`Gtk.PopoverMenu.flags`](https://docs.gtk.org/gtk4/property.PopoverMenu.flags.html) controls this appearance.
+ *
+ * `GtkPopoverMenu` is meant to be used primarily with menu models,
+ * using [`Gtk.PopoverMenu.new_from_model`](https://docs.gtk.org/gtk4/ctor.PopoverMenu.new_from_model.html). If you need to put
+ * other widgets such as a `GtkSpinButton` or a `GtkSwitch` into a popover,
+ * you can use [`Gtk.PopoverMenu.add_child`](https://docs.gtk.org/gtk4/method.PopoverMenu.add_child.html).
+ *
+ * For more dialog-like behavior, use a plain `GtkPopover`.
+ *
+ * ## Menu models
+ *
+ * The XML format understood by `GtkBuilder` for `GMenuModel` consists
+ * of a toplevel `<menu>` element, which contains one or more ``<item>``
+ * elements. Each ``<item>`` element contains ``<attribute>`` and `<link>`
+ * elements with a mandatory name attribute. `<link>` elements have the
+ * same content model as `<menu>`. Instead of `<link name="submenu">`
+ * or `<link name="section">`, you can use `<submenu>` or `<section>`
+ * elements.
+ *
+ * ```xml
+ * <menu id='app-menu'>
+ *   <section>
+ *     <item>
+ *       <attribute name='label' translatable='yes'>_New Window</attribute>
+ *       <attribute name='action'>app.new</attribute>
+ *     </item>
+ *     <item>
+ *       <attribute name='label' translatable='yes'>_About Sunny</attribute>
+ *       <attribute name='action'>app.about</attribute>
+ *     </item>
+ *     <item>
+ *       <attribute name='label' translatable='yes'>_Quit</attribute>
+ *       <attribute name='action'>app.quit</attribute>
+ *     </item>
+ *   </section>
+ * </menu>
+ * ```
+ *
+ * Attribute values can be translated using gettext, like other `GtkBuilder`
+ * content. ``<attribute>`` elements can be marked for translation with a
+ * `translatable="yes"` attribute. It is also possible to specify message
+ * context and translator comments, using the context and comments attributes.
+ * To make use of this, the `GtkBuilder` must have been given the gettext
+ * domain to use.
+ *
+ * The following attributes are used when constructing menu items:
+ *
+ * - "label": a user-visible string to display
+ * - "use-markup": whether the text in the menu item includes Pango markup
+ * - "action": the prefixed name of the action to trigger
+ * - "target": the parameter to use when activating the action
+ * - "icon" and "verb-icon": names of icons that may be displayed
+ * - "submenu-action": name of an action that may be used to track
+ *      whether a submenu is open
+ * - "hidden-when": a string used to determine when the item will be hidden.
+ *      Possible values include "action-disabled", "action-missing", "macos-menubar".
+ *      This is mainly useful for exported menus, see [`Gtk.Application.set_menubar`](https://docs.gtk.org/gtk4/method.Application.set_menubar.html).
+ * - "custom": a string used to match against the ID of a custom child added with
+ *      [`Gtk.PopoverMenu.add_child`](https://docs.gtk.org/gtk4/method.PopoverMenu.add_child.html), [`Gtk.PopoverMenuBar.add_child`](https://docs.gtk.org/gtk4/method.PopoverMenuBar.add_child.html),
+ *      or in the ui file with `<child type="ID">`.
+ *
+ * The following attributes are used when constructing sections:
+ *
+ * - "label": a user-visible string to use as section heading
+ * - "display-hint": a string used to determine special formatting for the section.
+ *     Possible values include "horizontal-buttons", "circular-buttons" and
+ *     "inline-buttons". They all indicate that section should be
+ *     displayed as a horizontal row of buttons.
+ * - "text-direction": a string used to determine the `GtkTextDirection` to use
+ *     when "display-hint" is set to "horizontal-buttons". Possible values
+ *     include "rtl", "ltr", and "none".
+ *
+ * The following attributes are used when constructing submenus:
+ *
+ * - "label": a user-visible string to display
+ * - "icon": icon name to display
+ * - "gtk-macos-special": (macOS only, ignored by others) Add special meaning to a menu
+ *     in the macOS menu bar. See Using GTK on Apple macOS.
+ *
+ * Menu items will also show accelerators, which are usually associated
+ * with actions via [`Gtk.Application.set_accels_for_action`](https://docs.gtk.org/gtk4/method.Application.set_accels_for_action.html),
+ * [`WidgetClass.add_binding_action`](https://docs.gtk.org/widgetclass/method.add_binding_action.html) or
+ * [`Gtk.ShortcutController.add_shortcut`](https://docs.gtk.org/gtk4/method.ShortcutController.add_shortcut.html).
+ *
+ * # Shortcuts and Gestures
+ *
+ * `GtkPopoverMenu` supports the following keyboard shortcuts:
+ *
+ * - `Space` activates the default widget.
+ *
+ * # CSS Nodes
+ *
+ * `GtkPopoverMenu` is just a subclass of `GtkPopover` that adds custom content
+ * to it, therefore it has the same CSS nodes. It is one of the cases that add
+ * a `.menu` style class to the main `popover` node.
+ *
+ * Menu items have nodes with name `button` and class `.model`. If a section
+ * display-hint is set, the section gets a node `box` with class `horizontal`
+ * plus a class with the same text as the display hint. Note that said box may
+ * not be the direct ancestor of the item `button`s. Thus, for example, to style
+ * items in an `inline-buttons` section, select `.inline-buttons button.model`.
+ * Other things that may be of interest to style in menus include `label` nodes.
+ *
+ * # Accessibility
+ *
+ * `GtkPopoverMenu` uses the [`Gtk.AccessibleRole.menu`](https://docs.gtk.org/gtk4/enum.AccessibleRole.menu.html) role, and its
+ * items use the [`Gtk.AccessibleRole.menu_item`](https://docs.gtk.org/gtk4/enum.AccessibleRole.menu_item.html),
+ * [`Gtk.AccessibleRole.checkbox`](https://docs.gtk.org/gtk4/enum.AccessibleRole.checkbox.html) or [`Gtk.AccessibleRole.menu_item_radio`](https://docs.gtk.org/gtk4/enum.AccessibleRole.menu_item_radio.html)
+ * roles, depending on the action they are connected to.
+ */
+export const GtkPopoverMenu: ((props: GtkPopoverMenuProps) => ReactNode) & {
+    MenuItem: (props: MenuItemProps) => ReactNode;
+    MenuSection: (props: MenuSectionProps) => ReactNode;
+    MenuSubmenu: (props: MenuSubmenuProps) => ReactNode;
+} = Object.assign(createSlotWidget<GtkPopoverMenuProps>("GtkPopoverMenu", []), {
+    MenuItem: createMenuChild<MenuItemProps>("MenuItem"),
+    MenuSection: createMenuChild<MenuSectionProps>("MenuSection"),
+    MenuSubmenu: createMenuChild<MenuSubmenuProps>("MenuSubmenu"),
+});
+
+/**
+ * Presents a horizontal bar of items that pop up menus when clicked.
+ *
+ * ![An example GtkPopoverMenuBar](https://docs.gtk.org/gtk4/menubar.png)
+ *
+ * The only way to create instances of `GtkPopoverMenuBar` is
+ * from a `GMenuModel`.
+ *
+ * # CSS nodes
+ *
+ * ```
+ * menubar
+ * ├── item[.active]
+ * ┊   ╰── popover
+ * ╰── item
+ *     ╰── popover
+ * ```
+ *
+ * `GtkPopoverMenuBar` has a single CSS node with name menubar, below which
+ * each item has its CSS node, and below that the corresponding popover.
+ *
+ * The item whose popover is currently open gets the .active
+ * style class.
+ *
+ * # Accessibility
+ *
+ * `GtkPopoverMenuBar` uses the [`Gtk.AccessibleRole.menu_bar`](https://docs.gtk.org/gtk4/enum.AccessibleRole.menu_bar.html) role,
+ * the menu items use the [`Gtk.AccessibleRole.menu_item`](https://docs.gtk.org/gtk4/enum.AccessibleRole.menu_item.html) role and
+ * the menus use the [`Gtk.AccessibleRole.menu`](https://docs.gtk.org/gtk4/enum.AccessibleRole.menu.html) role.
+ */
+export const GtkPopoverMenuBar: ((props: GtkPopoverMenuBarProps) => ReactNode) & {
+    MenuItem: (props: MenuItemProps) => ReactNode;
+    MenuSection: (props: MenuSectionProps) => ReactNode;
+    MenuSubmenu: (props: MenuSubmenuProps) => ReactNode;
+} = Object.assign(createSlotWidget<GtkPopoverMenuBarProps>("GtkPopoverMenuBar", []), {
+    MenuItem: createMenuChild<MenuItemProps>("MenuItem"),
+    MenuSection: createMenuChild<MenuSectionProps>("MenuSection"),
+    MenuSubmenu: createMenuChild<MenuSubmenuProps>("MenuSubmenu"),
+});
+
+/**
+ * Manages keyboard shortcuts and their activation.
+ *
+ * Most common shortcuts are using this controller implicitly, e.g. by
+ * adding a mnemonic underline to a [`Gtk.Label`](https://docs.gtk.org/gtk4/class.Label.html), or by installing a key
+ * binding using [`Gtk.WidgetClass.add_binding`](https://docs.gtk.org/gtk4/method.WidgetClass.add_binding.html), or by adding accelerators
+ * to global actions using [`Gtk.Application.set_accels_for_action`](https://docs.gtk.org/gtk4/method.Application.set_accels_for_action.html).
+ *
+ * But it is possible to create your own shortcut controller, and add
+ * shortcuts to it.
+ *
+ * `GtkShortcutController` implements [`Gio.ListModel`](https://docs.gtk.org/gio/iface.ListModel.html) for querying the
+ * shortcuts that have been added to it.
+ *
+ * # GtkShortcutController as GtkBuildable
+ *
+ * `GtkShortcutController`s can be created in [`Gtk.Builder`](https://docs.gtk.org/gtk4/class.Builder.html) ui files, to set up
+ * shortcuts in the same place as the widgets.
+ *
+ * An example of a UI definition fragment with `GtkShortcutController`:
+ * ```xml
+ *   <object class='GtkButton'>
+ *     <child>
+ *       <object class='GtkShortcutController'>
+ *         <property name='scope'>managed</property>
+ *         <child>
+ *           <object class='GtkShortcut'>
+ *             <property name='trigger'>&lt;Control&gt;k</property>
+ *             <property name='action'>activate</property>
+ *           </object>
+ *         </child>
+ *       </object>
+ *     </child>
+ *   </object>
+ * ```
+ *
+ * This example creates a [`Gtk.ActivateAction`](https://docs.gtk.org/gtk4/class.ActivateAction.html) for triggering the
+ * `activate` signal of the [`Gtk.Button`](https://docs.gtk.org/gtk4/class.Button.html). See [`Gtk.ShortcutAction.parse_string`](https://docs.gtk.org/gtk4/ctor.ShortcutAction.parse_string.html)
+ * for the syntax for other kinds of [`Gtk.ShortcutAction`](https://docs.gtk.org/gtk4/class.ShortcutAction.html). See
+ * [`Gtk.ShortcutTrigger.parse_string`](https://docs.gtk.org/gtk4/ctor.ShortcutTrigger.parse_string.html) to learn more about the syntax
+ * for triggers.
+ */
+export const GtkShortcutController: ((props: GtkShortcutControllerProps) => ReactNode) & {
+    Shortcut: (props: ShortcutProps) => ReactNode;
+} = Object.assign(createSlotWidget<GtkShortcutControllerProps>("GtkShortcutController", []), {
+    Shortcut: createVirtualChild<ShortcutProps>("Shortcut"),
+});
+
+/**
+ * Subclass of [`Gtk.TextView`](https://docs.gtk.org/gtk4/class.TextView.html).
+ *
+ * `GtkSourceView` is the main class of the GtkSourceView library.
+ * Use a [`Buffer`](https://docs.gtk.org/gtksource/class.Buffer.html) to display text with a `GtkSourceView`.
+ *
+ * This class provides:
+ *
+ *  - Show the line numbers;
+ *  - Show a right margin;
+ *  - Highlight the current line;
+ *  - Indentation settings;
+ *  - Configuration for the Home and End keyboard keys;
+ *  - Configure and show line marks;
+ *  - And a few other things.
+ *
+ * An easy way to test all these features is to use the test-widget mini-program
+ * provided in the GtkSourceView repository, in the tests/ directory.
+ *
+ * # GtkSourceView as GtkBuildable
+ *
+ * The GtkSourceView implementation of the [`Gtk.Buildable`](https://docs.gtk.org/gtk4/iface.Buildable.html) interface exposes the
+ * [`View.completion`](https://docs.gtk.org/gtksource/property.View.completion.html) object with the internal-child "completion".
+ *
+ * An example of a UI definition fragment with GtkSourceView:
+ * ```xml
+ * <object class="GtkSourceView" id="source_view">
+ *   <property name="tab-width">4</property>
+ *   <property name="auto-indent">True</property>
+ *   <child internal-child="completion">
+ *     <object class="GtkSourceCompletion">
+ *       <property name="select-on-show">False</property>
+ *     </object>
+ *   </child>
+ * </object>
+ * ```
+ *
+ * # Changing the Font
+ *
+ * Gtk CSS provides the best way to change the font for a `GtkSourceView` in a
+ * manner that allows for components like [`Map`](https://docs.gtk.org/gtksource/class.Map.html) to scale the desired
+ * font.
+ *
+ * ```c
+ * GtkCssProvider *provider = gtk_css_provider_new ();
+ * gtk_css_provider_load_from_string (provider,
+ *                                   "textview { font-family: Monospace; font-size: 8pt; }");
+ * gtk_style_context_add_provider (gtk_widget_get_style_context (view),
+ *                                 GTK_STYLE_PROVIDER (provider),
+ *                                 GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);
+ * g_object_unref (provider);
+ * ```
+ * ```python
+ * provider = Gtk.CssProvider()
+ * provider.load_from_string("textview { font-family: Monospace; font-size: 8pt; }")
+ * style_context = view.get_style_context()
+ * style_context.add_provider(provider, Gtk.STYLE_PROVIDER_PRIORITY_APPLICATION)
+ * ```
+ *
+ * If you need to adjust the font or size of font within a portion of the
+ * document only, you should use a [`Gtk.TextTag`](https://docs.gtk.org/gtk4/class.TextTag.html) with the [`Gtk.TextTag.family`](https://docs.gtk.org/gtk4/property.TextTag.family.html) or
+ * [`Gtk.TextTag.scale`](https://docs.gtk.org/gtk4/property.TextTag.scale.html) set so that the font size may be scaled relative to
+ * the default font set in CSS.
+ */
+export const GtkSourceView: ((props: GtkSourceViewProps) => ReactNode) & {
+    Tag: (props: TextTagProps) => ReactNode;
+    Anchor: (props: TextAnchorProps) => ReactNode;
+    Paintable: (props: TextPaintableProps) => ReactNode;
+} = Object.assign(createSlotWidget<GtkSourceViewProps>("GtkSourceView", []), {
+    Tag: createVirtualChild<TextTagProps>("TextTag"),
+    Anchor: createVirtualChild<TextAnchorProps>("TextAnchor"),
+    Paintable: createVirtualChild<TextPaintableProps>("TextPaintable"),
+});
+
+/**
+ * Shows one of its children at a time.
+ *
+ * ![An example GtkStack](https://docs.gtk.org/gtk4/stack.png)
+ *
+ * In contrast to `GtkNotebook`, `GtkStack` does not provide a means
+ * for users to change the visible child. Instead, a separate widget
+ * such as [`Gtk.StackSwitcher`](https://docs.gtk.org/gtk4/class.StackSwitcher.html) or [`Gtk.StackSidebar`](https://docs.gtk.org/gtk4/class.StackSidebar.html) can
+ * be used with `GtkStack` to provide this functionality.
+ *
+ * Transitions between pages can be animated as slides or fades. This
+ * can be controlled with [`Gtk.Stack.set_transition_type`](https://docs.gtk.org/gtk4/method.Stack.set_transition_type.html).
+ * These animations respect the [`Gtk.Settings.gtk-enable-animations`](https://docs.gtk.org/gtk4/property.Settings.gtk-enable-animations.html)
+ * setting.
+ *
+ * `GtkStack` maintains a [`Gtk.StackPage`](https://docs.gtk.org/gtk4/class.StackPage.html) object for each added
+ * child, which holds additional per-child properties. You
+ * obtain the `GtkStackPage` for a child with [`Gtk.Stack.get_page`](https://docs.gtk.org/gtk4/method.Stack.get_page.html)
+ * and you can obtain a `GtkSelectionModel` containing all the pages
+ * with [`Gtk.Stack.get_pages`](https://docs.gtk.org/gtk4/method.Stack.get_pages.html).
+ *
+ * # GtkStack as GtkBuildable
+ *
+ * To set child-specific properties in a .ui file, create `GtkStackPage`
+ * objects explicitly, and set the child widget as a property on it:
+ *
+ * ```xml
+ *   <object class="GtkStack" id="stack">
+ *     <child>
+ *       <object class="GtkStackPage">
+ *         <property name="name">page1</property>
+ *         <property name="title">In the beginning…</property>
+ *         <property name="child">
+ *           <object class="GtkLabel">
+ *             <property name="label">It was dark</property>
+ *           </object>
+ *         </property>
+ *       </object>
+ *     </child>
+ * ```
+ *
+ * # CSS nodes
+ *
+ * `GtkStack` has a single CSS node named stack.
+ *
+ * # Accessibility
+ *
+ * `GtkStack` uses the [`Gtk.AccessibleRole.tab_panel`](https://docs.gtk.org/gtk4/enum.AccessibleRole.tab_panel.html) role for the stack
+ * pages, which are the accessible parent objects of the child widgets.
+ */
+export const GtkStack: ((props: GtkStackProps) => ReactNode) & {
+    Page: (props: StackPageProps) => ReactNode;
+} = Object.assign(createSlotWidget<GtkStackProps>("GtkStack", []), {
+    Page: createVirtualChild<StackPageProps>("StackPage"),
+});
+
+/**
+ * Displays the contents of a [`Gtk.TextBuffer`](https://docs.gtk.org/gtk4/class.TextBuffer.html).
+ *
+ * ![An example GtkTextView](https://docs.gtk.org/gtk4/multiline-text.png)
+ *
+ * You may wish to begin by reading the conceptual overview,
+ * which gives an overview of all the objects and data types related to the
+ * text widget and how they work together.
+ *
+ * ## Shortcuts and Gestures
+ *
+ * `GtkTextView` supports the following keyboard shortcuts:
+ *
+ * - `Shift`+`F10` or `Menu` opens the context menu.
+ * - `Ctrl`+`Z` undoes the last modification.
+ * - `Ctrl`+`Y` or `Ctrl`+`Shift`+`Z`
+ *    redoes the last undone modification.
+ * - `Clear` clears the content.
+ *
+ * Additionally, the following signals have default keybindings:
+ *
+ * - [`Gtk.TextView.:backspace`](https://docs.gtk.org/gtk4/signal.TextView.backspace.html)
+ * - [`Gtk.TextView.:copy-clipboard`](https://docs.gtk.org/gtk4/signal.TextView.copy-clipboard.html)
+ * - [`Gtk.TextView.:cut-clipboard`](https://docs.gtk.org/gtk4/signal.TextView.cut-clipboard.html)
+ * - [`Gtk.TextView.:delete-from-cursor`](https://docs.gtk.org/gtk4/signal.TextView.delete-from-cursor.html)
+ * - [`Gtk.TextView.:insert-emoji`](https://docs.gtk.org/gtk4/signal.TextView.insert-emoji.html)
+ * - [`Gtk.TextView.:move-cursor`](https://docs.gtk.org/gtk4/signal.TextView.move-cursor.html)
+ * - [`Gtk.TextView.:paste-clipboard`](https://docs.gtk.org/gtk4/signal.TextView.paste-clipboard.html)
+ * - [`Gtk.TextView.:select-all`](https://docs.gtk.org/gtk4/signal.TextView.select-all.html)
+ * - [`Gtk.TextView.:toggle-cursor-visible`](https://docs.gtk.org/gtk4/signal.TextView.toggle-cursor-visible.html)
+ * - [`Gtk.TextView.:toggle-overwrite`](https://docs.gtk.org/gtk4/signal.TextView.toggle-overwrite.html)
+ *
+ * ## Actions
+ *
+ * `GtkTextView` defines a set of built-in actions:
+ *
+ * - `clipboard.copy` copies the contents to the clipboard.
+ * - `clipboard.cut` copies the contents to the clipboard and deletes it from
+ *   the widget.
+ * - `clipboard.paste` inserts the contents of the clipboard into the widget.
+ * - `menu.popup` opens the context menu.
+ * - `misc.insert-emoji` opens the Emoji chooser.
+ * - `selection.delete` deletes the current selection.
+ * - `selection.select-all` selects all of the widgets content.
+ * - `text.redo` redoes the last change to the contents.
+ * - `text.undo` undoes the last change to the contents.
+ * - `text.clear` clears the content.
+ *
+ * ## CSS nodes
+ *
+ * ```
+ * textview.view
+ * ├── border.top
+ * ├── border.left
+ * ├── text
+ * │   ╰── [selection]
+ * ├── border.right
+ * ├── border.bottom
+ * ╰── [window.popup]
+ * ```
+ *
+ * `GtkTextView` has a main css node with name textview and style class .view,
+ * and subnodes for each of the border windows, and the main text area,
+ * with names border and text, respectively. The border nodes each get
+ * one of the style classes .left, .right, .top or .bottom.
+ *
+ * A node representing the selection will appear below the text node.
+ *
+ * If a context menu is opened, the window node will appear as a subnode
+ * of the main node.
+ *
+ * ## Accessibility
+ *
+ * `GtkTextView` uses the [`Gtk.AccessibleRole.text_box`](https://docs.gtk.org/gtk4/enum.AccessibleRole.text_box.html) role.
+ */
+export const GtkTextView: ((props: GtkTextViewProps) => ReactNode) & {
+    Tag: (props: TextTagProps) => ReactNode;
+    Anchor: (props: TextAnchorProps) => ReactNode;
+    Paintable: (props: TextPaintableProps) => ReactNode;
+} = Object.assign(createSlotWidget<GtkTextViewProps>("GtkTextView", []), {
+    Tag: createVirtualChild<TextTagProps>("TextTag"),
+    Anchor: createVirtualChild<TextAnchorProps>("TextAnchor"),
+    Paintable: createVirtualChild<TextPaintableProps>("TextPaintable"),
+});
+
+/**
+ * A toplevel window which can contain other widgets.
+ *
+ * ![An example GtkWindow](https://docs.gtk.org/gtk4/window.png)
+ *
+ * Windows normally have decorations that are under the control
+ * of the windowing system and allow the user to manipulate the window
+ * (resize it, move it, close it,...).
+ *
+ * # GtkWindow as GtkBuildable
+ *
+ * The `GtkWindow` implementation of the [`Gtk.Buildable`](https://docs.gtk.org/gtk4/iface.Buildable.html) interface supports
+ * setting a child as the titlebar by specifying “titlebar” as the “type”
+ * attribute of a ``<child>`` element.
+ *
+ * # Shortcuts and Gestures
+ *
+ * `GtkWindow` supports the following keyboard shortcuts:
+ *
+ * - `F10` activates the menubar, if present.
+ * - `Alt` makes the mnemonics visible while pressed.
+ *
+ * The following signals have default keybindings:
+ *
+ * - [`Gtk.Window.:activate-default`](https://docs.gtk.org/gtk4/signal.Window.activate-default.html)
+ * - [`Gtk.Window.:activate-focus`](https://docs.gtk.org/gtk4/signal.Window.activate-focus.html)
+ * - [`Gtk.Window.:enable-debugging`](https://docs.gtk.org/gtk4/signal.Window.enable-debugging.html)
+ *
+ * # Actions
+ *
+ * `GtkWindow` defines a set of built-in actions:
+ *
+ * - `default.activate` activates the default widget.
+ * - `window.minimize` minimizes the window.
+ * - `window.toggle-maximized` maximizes or restores the window.
+ * - `window.close` closes the window.
+ *
+ * # CSS nodes
+ *
+ * ```
+ * window.background [.csd / .solid-csd / .ssd] [.maximized / .fullscreen / .tiled]
+ * ├── <child>
+ * ╰── <titlebar child>.titlebar [.default-decoration]
+ * ```
+ *
+ * `GtkWindow` has a main CSS node with name window and style class .background.
+ *
+ * Style classes that are typically used with the main CSS node are .csd (when
+ * client-side decorations are in use), .solid-csd (for client-side decorations
+ * without invisible borders), .ssd (used by mutter when rendering server-side
+ * decorations). GtkWindow also represents window states with the following
+ * style classes on the main node: .maximized, .fullscreen, .tiled (when supported,
+ * also .tiled-top, .tiled-left, .tiled-right, .tiled-bottom).
+ *
+ * `GtkWindow` subclasses often add their own discriminating style classes,
+ * such as .dialog, .popup or .tooltip.
+ *
+ * Generally, some CSS properties don't make sense on the toplevel window node,
+ * such as margins or padding. When client-side decorations without invisible
+ * borders are in use (i.e. the .solid-csd style class is added to the
+ * main window node), the CSS border of the toplevel window is used for
+ * resize drags. In the .csd case, the shadow area outside of the window
+ * can be used to resize it.
+ *
+ * `GtkWindow` adds the .titlebar and .default-decoration style classes to the
+ * widget that is added as a titlebar child.
+ *
+ * # Accessibility
+ *
+ * `GtkWindow` uses the [`Gtk.AccessibleRole.window`](https://docs.gtk.org/gtk4/enum.AccessibleRole.window.html) role.
+ *
+ * From GTK 4.12 to 4.18, it used the [`Gtk.AccessibleRole.application`](https://docs.gtk.org/gtk4/enum.AccessibleRole.application.html) role.
+ */
+export const GtkWindow: (props: GtkWindowProps) => ReactNode = createSlotWidget<GtkWindowProps>("GtkWindow", ["titlebar"]);
+
+/**
+ * Type mapping widgets to their valid container slot method names.
+ *
+ * Each key is a JSX element name and each value is a union of method names
+ * used by container slot compound components (e.g. `AdwHeaderBar.PackStart`).
+ */
+export type ContainerSlotNames = {
+    AdwActionRow: "addPrefix" | "addSuffix";
+    AdwEntryRow: "addPrefix" | "addSuffix";
+    AdwExpanderRow: "addPrefix" | "addSuffix" | "addRow" | "addAction";
+    AdwHeaderBar: "packStart" | "packEnd";
+    AdwToolbarView: "addTopBar" | "addBottomBar";
+    GtkActionBar: "packStart" | "packEnd";
+    GtkHeaderBar: "packStart" | "packEnd";
+};