@peachy/react 0.0.10 → 0.0.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +5 -22
- package/dist/global.d.mts +6 -29
- package/dist/hostconfig.mjs +11 -11
- package/package.json +9 -9
- package/tsconfig.json +7 -5
package/README.md
CHANGED
|
@@ -36,10 +36,7 @@ Here is a basic example that creates a GTK application window with a label:
|
|
|
36
36
|
import Gtk from "gi://Gtk?version=4.0";
|
|
37
37
|
import { render } from "@peachy/react";
|
|
38
38
|
|
|
39
|
-
const app = Gtk.Application.new(
|
|
40
|
-
"com.hello.world",
|
|
41
|
-
Gio.ApplicationFlags.DEFAULT_FLAGS,
|
|
42
|
-
);
|
|
39
|
+
const app = Gtk.Application.new("com.hello.world", Gio.ApplicationFlags.DEFAULT_FLAGS);
|
|
43
40
|
|
|
44
41
|
app.connect("activate", () => {
|
|
45
42
|
const app_window = Gtk.ApplicationWindow.new(app);
|
|
@@ -58,22 +55,14 @@ You can also create reusable components using React's component system. For exam
|
|
|
58
55
|
import Gtk from "gi://Gtk?version=4.0";
|
|
59
56
|
import { render } from "@peachy/react";
|
|
60
57
|
|
|
61
|
-
const Button = ({ label, onClick }) =>
|
|
62
|
-
<Gtk.Button label={label} onClick={onClick} />
|
|
63
|
-
);
|
|
58
|
+
const Button = ({ label, onClick }) => <Gtk.Button label={label} onClick={onClick} />;
|
|
64
59
|
|
|
65
|
-
const app = Gtk.Application.new(
|
|
66
|
-
"com.hello.world",
|
|
67
|
-
Gio.ApplicationFlags.DEFAULT_FLAGS,
|
|
68
|
-
);
|
|
60
|
+
const app = Gtk.Application.new("com.hello.world", Gio.ApplicationFlags.DEFAULT_FLAGS);
|
|
69
61
|
|
|
70
62
|
app.connect("activate", () => {
|
|
71
63
|
const app_window = Gtk.ApplicationWindow.new(app);
|
|
72
64
|
|
|
73
|
-
render(
|
|
74
|
-
<Button label="Click me!" onClick={() => console.log("Button clicked")} />,
|
|
75
|
-
app_window,
|
|
76
|
-
);
|
|
65
|
+
render(<Button label="Click me!" onClick={() => console.log("Button clicked")} />, app_window);
|
|
77
66
|
|
|
78
67
|
app_window.present();
|
|
79
68
|
});
|
|
@@ -95,13 +84,7 @@ const Button = () => {
|
|
|
95
84
|
const onClicked = () => console.log("Button clicked");
|
|
96
85
|
const onFocused = () => console.log("Button focused/unfocused");
|
|
97
86
|
|
|
98
|
-
return
|
|
99
|
-
<Gtk.Button
|
|
100
|
-
label="Hello World"
|
|
101
|
-
onClicked={onClicked}
|
|
102
|
-
onNotify:hasFocus={onFocused}
|
|
103
|
-
/>
|
|
104
|
-
);
|
|
87
|
+
return <Gtk.Button label="Hello World" onClicked={onClicked} onNotify:hasFocus={onFocused} />;
|
|
105
88
|
};
|
|
106
89
|
|
|
107
90
|
app.run([]);
|
package/dist/global.d.mts
CHANGED
|
@@ -3,42 +3,19 @@ import { Key, Ref } from "react";
|
|
|
3
3
|
|
|
4
4
|
//#region src/global.d.ts
|
|
5
5
|
type PascalCase<S> = S extends `${infer Head}${"-" | "_"}${infer Tail}` ? `${Capitalize<Head>}${PascalCase<Tail>}` : S extends string ? Capitalize<S> : never;
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
`on${PascalCase<`${E}:${D}`>}` : S extends string ? `on${PascalCase<S>}` : never]?: GObject.SignalCallback<Self, Self["$signals"][S]> };
|
|
6
|
+
// [TODO] maybe optimize this later by getting all the static signals
|
|
7
|
+
type SignalProps<Self extends GObject.Object> = { [S in keyof Self["$signals"] as S extends `${infer E}::${infer D}` ? `on${PascalCase<E>}:${E extends "notify" ? PascalCase<keyof Self["$readableProperties"]> : string}` : S extends string ? `on${PascalCase<S>}` : never]?: GObject.SignalCallback<Self, Self["$signals"][S]> };
|
|
9
8
|
declare global {
|
|
10
9
|
namespace JSX {
|
|
11
10
|
interface IntrinsicAttributes {
|
|
12
11
|
childType?: string;
|
|
13
12
|
ref?: Ref<any>;
|
|
14
13
|
key?: Key | null | undefined;
|
|
14
|
+
children?: OrArray<any>;
|
|
15
15
|
}
|
|
16
|
-
type LibraryManagedAttributes<C, Props> = C extends
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
declare module "gi://Gtk?version=4.0" {
|
|
20
|
-
namespace Gtk {
|
|
21
|
-
namespace Widget {
|
|
22
|
-
interface ConstructorProps {
|
|
23
|
-
/**
|
|
24
|
-
* React children
|
|
25
|
-
*/
|
|
26
|
-
children: any;
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
}
|
|
31
|
-
declare module "gi://Gtk?version=3.0" {
|
|
32
|
-
namespace Gtk {
|
|
33
|
-
namespace Widget {
|
|
34
|
-
interface ConstructorProps {
|
|
35
|
-
/**
|
|
36
|
-
* React children
|
|
37
|
-
*/
|
|
38
|
-
children: any;
|
|
39
|
-
}
|
|
40
|
-
}
|
|
16
|
+
type LibraryManagedAttributes<C, Props> = C["prototype"] extends GObject.Object ? Props & SignalProps<C["prototype"]> : Props;
|
|
41
17
|
}
|
|
42
18
|
}
|
|
19
|
+
type OrArray<T> = T | T[];
|
|
43
20
|
//#endregion
|
|
44
|
-
export { PascalCase
|
|
21
|
+
export { PascalCase };
|
package/dist/hostconfig.mjs
CHANGED
|
@@ -13,15 +13,15 @@ const hostConfig = {
|
|
|
13
13
|
appendInitialChild(parentInstance, child) {
|
|
14
14
|
appendChild(parentInstance, child);
|
|
15
15
|
},
|
|
16
|
-
createInstance(type, props
|
|
16
|
+
createInstance(type, props) {
|
|
17
17
|
const klass = typeMap.get(type);
|
|
18
18
|
if (!klass) throw new Error(`Unknown type: ${type}`);
|
|
19
19
|
return new klass(getProperties(props));
|
|
20
20
|
},
|
|
21
|
-
createTextInstance(
|
|
22
|
-
return Gtk.Label
|
|
21
|
+
createTextInstance(label) {
|
|
22
|
+
return new Gtk.Label({ label });
|
|
23
23
|
},
|
|
24
|
-
finalizeInitialChildren(widget,
|
|
24
|
+
finalizeInitialChildren(widget, _type, props) {
|
|
25
25
|
const events = getEventListeners(props);
|
|
26
26
|
Object.keys(events).forEach((name) => {
|
|
27
27
|
const eventType = getEventName(name);
|
|
@@ -33,24 +33,24 @@ const hostConfig = {
|
|
|
33
33
|
getPublicInstance(inst) {
|
|
34
34
|
return inst;
|
|
35
35
|
},
|
|
36
|
-
prepareForCommit(
|
|
36
|
+
prepareForCommit() {
|
|
37
37
|
return null;
|
|
38
38
|
},
|
|
39
39
|
resetAfterCommit() {},
|
|
40
|
-
getRootHostContext(
|
|
40
|
+
getRootHostContext() {
|
|
41
41
|
return emptyObject;
|
|
42
42
|
},
|
|
43
|
-
getChildHostContext(
|
|
43
|
+
getChildHostContext() {
|
|
44
44
|
return emptyObject;
|
|
45
45
|
},
|
|
46
|
-
shouldSetTextContent(
|
|
46
|
+
shouldSetTextContent() {
|
|
47
47
|
return false;
|
|
48
48
|
},
|
|
49
49
|
supportsMutation: true,
|
|
50
50
|
supportsHydration: false,
|
|
51
51
|
supportsPersistence: false,
|
|
52
52
|
supportsMicrotasks: true,
|
|
53
|
-
scheduleTimeout: (fn, delay) => {
|
|
53
|
+
scheduleTimeout: (fn, delay = 10) => {
|
|
54
54
|
GLib.timeout_add(GLib.PRIORITY_DEFAULT, delay, () => {
|
|
55
55
|
fn();
|
|
56
56
|
return GLib.SOURCE_REMOVE;
|
|
@@ -81,8 +81,8 @@ const hostConfig = {
|
|
|
81
81
|
appendChildToContainer(container, child) {
|
|
82
82
|
appendChild(container, child);
|
|
83
83
|
},
|
|
84
|
-
detachDeletedInstance(
|
|
85
|
-
commitUpdate(widget, type, oldProps, newProps
|
|
84
|
+
detachDeletedInstance() {},
|
|
85
|
+
commitUpdate(widget, type, oldProps, newProps) {
|
|
86
86
|
updateWidget(widget, oldProps, newProps);
|
|
87
87
|
},
|
|
88
88
|
commitTextUpdate(textInstance, oldText, newText) {
|
package/package.json
CHANGED
|
@@ -1,7 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@peachy/react",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.11",
|
|
4
4
|
"description": "Run GJS applications with react",
|
|
5
|
+
"license": "MIT",
|
|
6
|
+
"author": "Angelo Verlain <hey@vixalien.com>",
|
|
7
|
+
"files": [
|
|
8
|
+
"dist",
|
|
9
|
+
"tsconfig.json"
|
|
10
|
+
],
|
|
5
11
|
"main": "./dist/index.mjs",
|
|
6
12
|
"exports": {
|
|
7
13
|
".": {
|
|
@@ -14,13 +20,12 @@
|
|
|
14
20
|
},
|
|
15
21
|
"./tsconfig": "./tsconfig.json"
|
|
16
22
|
},
|
|
17
|
-
"author": "Angelo Verlain <hey@vixalien.com>",
|
|
18
23
|
"dependencies": {
|
|
19
|
-
"@peachy/types": "^
|
|
24
|
+
"@peachy/types": "^0.0.0-girgen.2",
|
|
20
25
|
"react": "^19.2.4",
|
|
21
26
|
"react-reconciler": "^0.33.0",
|
|
22
27
|
"reflect-metadata": "^0.2.2",
|
|
23
|
-
"@peachy/core": "0.0.
|
|
28
|
+
"@peachy/core": "0.0.11"
|
|
24
29
|
},
|
|
25
30
|
"devDependencies": {
|
|
26
31
|
"@types/node": "^25.2.1",
|
|
@@ -29,11 +34,6 @@
|
|
|
29
34
|
"tsdown": "0.20.3",
|
|
30
35
|
"typescript": "^5.9.3"
|
|
31
36
|
},
|
|
32
|
-
"files": [
|
|
33
|
-
"dist",
|
|
34
|
-
"tsconfig.json"
|
|
35
|
-
],
|
|
36
|
-
"license": "MIT",
|
|
37
37
|
"scripts": {
|
|
38
38
|
"build": "tsdown"
|
|
39
39
|
},
|
package/tsconfig.json
CHANGED
|
@@ -2,15 +2,17 @@
|
|
|
2
2
|
"extends": "@peachy/core/tsconfig",
|
|
3
3
|
"compilerOptions": {
|
|
4
4
|
"jsx": "react-jsx",
|
|
5
|
-
"jsxImportSource": "@peachy/react"
|
|
5
|
+
"jsxImportSource": "@peachy/react"
|
|
6
6
|
},
|
|
7
7
|
"include": [
|
|
8
8
|
// when installed locally
|
|
9
9
|
"./node_modules/@peachy/types/types/index.d.ts",
|
|
10
|
-
"./node_modules/@peachy/core/node_modules/@peachy/plugin-resources/src/
|
|
10
|
+
"./node_modules/@peachy/core/node_modules/@peachy/plugin-resources/src/modules.d.ts",
|
|
11
|
+
"./node_modules/@peachy/core/node_modules/@peachy/plugin-css/src/modules.d.ts",
|
|
11
12
|
// when installed via npm/pnpm
|
|
12
13
|
"../types/types/index.d.ts",
|
|
13
|
-
"../plugin-resources/src/
|
|
14
|
-
"
|
|
15
|
-
|
|
14
|
+
"../plugin-resources/src/modules.d.ts",
|
|
15
|
+
"../plugin-css/src/modules.d.ts",
|
|
16
|
+
"${configDir}/src/**/*"
|
|
17
|
+
]
|
|
16
18
|
}
|