add gtk typings and renderer for window
This commit is contained in:
parent
496b761bb6
commit
3f42182fb1
5 changed files with 36 additions and 10 deletions
|
|
@ -1,14 +1,16 @@
|
||||||
import { renderJSX } from "./render";
|
import { renderJSX } from "./render";
|
||||||
import type { JSXChildren, RenderedNode } from "./types";
|
import type { GtkElements, GtkTag, JSXChildren } from "./types";
|
||||||
|
import type GObject20 from "gi://GObject?version=2.0";
|
||||||
|
|
||||||
namespace JSX {
|
namespace JSX {
|
||||||
export type Attributes = Record<string, unknown> & JSXChildren;
|
|
||||||
// Allow any html tag
|
// Allow any html tag
|
||||||
export type IntrinsicElements = Record<string, Attributes>;
|
export type IntrinsicElements = {
|
||||||
|
[T in GtkTag]: GtkElements[T] & JSXChildren;
|
||||||
|
};
|
||||||
|
|
||||||
// Declare the shape of JSX rendering result
|
// Declare the shape of JSX rendering result
|
||||||
// This is required so the return types of components can be inferred
|
// This is required so the return types of components can be inferred
|
||||||
export type Element = RenderedNode;
|
export type Element = GObject20.Object & {};
|
||||||
}
|
}
|
||||||
|
|
||||||
// Expose the main namespace
|
// Expose the main namespace
|
||||||
|
|
|
||||||
|
|
@ -1,16 +1,25 @@
|
||||||
import type { JSX } from "./jsx-runtime";
|
import type { JSX } from "./jsx-runtime";
|
||||||
import type { FunctionComponent } from "./types";
|
import {
|
||||||
|
GtkClasses,
|
||||||
|
type FunctionComponent,
|
||||||
|
type GtkElements,
|
||||||
|
type GtkTag,
|
||||||
|
} from "./types";
|
||||||
|
|
||||||
export function renderJSX<T extends keyof JSX.IntrinsicElements>(
|
function renderTag<T extends GtkTag>(tag: T, attributes: GtkElements[T]) {
|
||||||
tag: string | FunctionComponent | undefined,
|
return new GtkClasses[tag]({ ...attributes });
|
||||||
|
}
|
||||||
|
|
||||||
|
export function renderJSX<T extends GtkTag>(
|
||||||
|
tag: T | FunctionComponent | undefined,
|
||||||
props: JSX.IntrinsicElements[T],
|
props: JSX.IntrinsicElements[T],
|
||||||
) {
|
) {
|
||||||
if (typeof tag === "function") {
|
if (typeof tag === "function") {
|
||||||
return tag(props);
|
return tag(props as Record<string, unknown>);
|
||||||
}
|
}
|
||||||
if (typeof tag === "undefined") {
|
if (typeof tag === "undefined") {
|
||||||
return {};
|
return {};
|
||||||
}
|
}
|
||||||
const { children, ...rest } = props;
|
const { children, ...rest } = props;
|
||||||
return { [tag]: { ...rest } };
|
return renderTag(tag, rest as GtkElements[T]);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
11
lib/jsx/types/gtk.ts
Normal file
11
lib/jsx/types/gtk.ts
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
import Gtk40 from "gi://Gtk?version=4.0";
|
||||||
|
|
||||||
|
export const GtkClasses = {
|
||||||
|
window: Gtk40.Window,
|
||||||
|
};
|
||||||
|
export type GtkElements = {
|
||||||
|
[K in keyof typeof GtkClasses]: ConstructorParameters<
|
||||||
|
(typeof GtkClasses)[K]
|
||||||
|
>[0];
|
||||||
|
};
|
||||||
|
export type GtkTag = keyof typeof GtkClasses;
|
||||||
2
lib/jsx/types/index.ts
Normal file
2
lib/jsx/types/index.ts
Normal file
|
|
@ -0,0 +1,2 @@
|
||||||
|
export * from "./gtk";
|
||||||
|
export * from "./jsx";
|
||||||
|
|
@ -1,4 +1,6 @@
|
||||||
export type RenderedNode = object;
|
import type { JSX } from "@lib/jsx/jsx-runtime";
|
||||||
|
|
||||||
|
export type RenderedNode = JSX.Element;
|
||||||
|
|
||||||
export type JSXNode =
|
export type JSXNode =
|
||||||
| RenderedNode
|
| RenderedNode
|
||||||
Loading…
Add table
Reference in a new issue