@@ -1,17 +1,25 @@
|
|||||||
import { Control } from "godot"
|
import { Control, Label } from "godot"
|
||||||
import { Node } from "react-godot-renderer"
|
import { Component } from "react-godot-renderer"
|
||||||
|
|
||||||
|
|
||||||
|
const ControlFC = Component.make(Control)
|
||||||
|
const LabelFC = Component.make(Label)
|
||||||
|
|
||||||
export function TestUi1Component() {
|
export function TestUi1Component() {
|
||||||
return (
|
return (
|
||||||
<Node
|
<ControlFC
|
||||||
class={Control}
|
name="Root"
|
||||||
anchor_left={0}
|
anchor_left={0}
|
||||||
|
anchor_top={0}
|
||||||
|
anchor_right={0}
|
||||||
|
anchor_bottom={0}
|
||||||
|
>
|
||||||
|
<LabelFC
|
||||||
|
name="Label"
|
||||||
|
text="This is a label"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
<node2D name="Issou" />
|
||||||
|
</ControlFC>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
Node({
|
|
||||||
class: Control,
|
|
||||||
|
|
||||||
})
|
|
||||||
|
|||||||
15
packages/react-godot-renderer/src/Component.ts
Normal file
15
packages/react-godot-renderer/src/Component.ts
Normal file
@@ -0,0 +1,15 @@
|
|||||||
|
import type * as Godot from "godot"
|
||||||
|
import * as React from "react"
|
||||||
|
import type * as JSX from "./JSX.js"
|
||||||
|
|
||||||
|
|
||||||
|
export type Props<T extends Godot.Node> = JSX.PropsFromInstance<T>
|
||||||
|
export type Component<T extends Godot.Node> = React.FunctionComponent<Props<T>>
|
||||||
|
|
||||||
|
export const make = <T extends Godot.Node>(
|
||||||
|
class_: new (...args: any[]) => T
|
||||||
|
): Component<T> => {
|
||||||
|
const f = (props: Props<T>) => React.createElement("element", { ...props, class: class_ })
|
||||||
|
f.displayName = class_.name
|
||||||
|
return f
|
||||||
|
}
|
||||||
@@ -17,7 +17,7 @@ export type GodotIntrinsicElements = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export type PropsFromInstance<T> = {
|
export type PropsFromInstance<T> = {
|
||||||
// biome-ignore lint/complexity/noBannedTypes: it's completely fine
|
// biome-ignore lint/complexity/noBannedTypes: using Function here is completely fine
|
||||||
[K in keyof T as T[K] extends Function ? never : K]?: T[K]
|
[K in keyof T as T[K] extends Function ? never : K]?: T[K]
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -25,6 +25,10 @@ declare global {
|
|||||||
namespace React {
|
namespace React {
|
||||||
namespace JSX {
|
namespace JSX {
|
||||||
interface IntrinsicElements extends GodotIntrinsicElements {}
|
interface IntrinsicElements extends GodotIntrinsicElements {}
|
||||||
|
interface IntrinsicAttributes {
|
||||||
|
children?: React.ReactNode
|
||||||
|
name?: string
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,14 +0,0 @@
|
|||||||
import type * as Godot from "godot"
|
|
||||||
import * as React from "react"
|
|
||||||
import type * as JSX from "./JSX.js"
|
|
||||||
|
|
||||||
|
|
||||||
export type NodeProps<T extends Godot.Node> = {
|
|
||||||
readonly class: new (...args: any[]) => T
|
|
||||||
} & JSX.PropsFromInstance<NoInfer<T>>
|
|
||||||
|
|
||||||
export function Node<T extends Godot.Node>(
|
|
||||||
props: NodeProps<T>
|
|
||||||
): React.JSX.Element {
|
|
||||||
return React.createElement("element", props)
|
|
||||||
}
|
|
||||||
@@ -1,4 +1,4 @@
|
|||||||
|
export * as Component from "./Component.js"
|
||||||
export * as JSX from "./JSX.js"
|
export * as JSX from "./JSX.js"
|
||||||
export * from "./Node.js"
|
|
||||||
export * as Reconciler from "./Reconciler.js"
|
export * as Reconciler from "./Reconciler.js"
|
||||||
export * as Renderer from "./Renderer.js"
|
export * as Renderer from "./Renderer.js"
|
||||||
|
|||||||
Reference in New Issue
Block a user