ziex 0.1.0-dev.864 → 0.1.0-dev.865
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/bin/ziex +61 -0
- package/install.cjs +218 -0
- package/package.json +16 -11
- package/README.md +0 -195
- package/app.d.ts +0 -112
- package/aws-lambda/index.d.ts +0 -96
- package/aws-lambda/index.js +0 -126
- package/build.zig +0 -5
- package/build.zig.zon +0 -7
- package/cloudflare/app.d.ts +0 -2
- package/cloudflare/do.d.ts +0 -48
- package/cloudflare/index.d.ts +0 -4
- package/cloudflare/index.js +0 -1707
- package/cloudflare/kv.d.ts +0 -2
- package/cloudflare/worker.d.ts +0 -3
- package/index.d.ts +0 -2
- package/index.js +0 -739
- package/kv.d.ts +0 -27
- package/react/dom.d.ts +0 -21
- package/react/index.d.ts +0 -2
- package/react/index.js +0 -144
- package/react/types.d.ts +0 -190
- package/runtime.d.ts +0 -70
- package/vercel/index.d.ts +0 -26
- package/vercel/index.js +0 -18
- package/wasi.d.ts +0 -61
- package/wasm/core.d.ts +0 -78
- package/wasm/dom.d.ts +0 -4
- package/wasm/index.d.ts +0 -46
- package/wasm/index.js +0 -895
- package/wasm/init.d.ts +0 -1
- package/wasm/init.js +0 -873
- package/wasm/types.d.ts +0 -1
- package/wasm/wasi.d.ts +0 -28
- package/zx.d.ts +0 -1
package/bin/ziex
ADDED
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
2
|
+
|
|
3
|
+
// Stub that delegates to the native zx binary.
|
|
4
|
+
// The postinstall script copies it to bin/zx, but if that hasn't run
|
|
5
|
+
// (e.g. bunx), we resolve the platform package's binary directly.
|
|
6
|
+
|
|
7
|
+
import { execFileSync } from "child_process";
|
|
8
|
+
import { existsSync } from "fs";
|
|
9
|
+
import { createRequire } from "module";
|
|
10
|
+
import { dirname, join } from "path";
|
|
11
|
+
import { fileURLToPath } from "url";
|
|
12
|
+
|
|
13
|
+
const __dirname = dirname(fileURLToPath(import.meta.url));
|
|
14
|
+
const require = createRequire(import.meta.url);
|
|
15
|
+
const isWindows = process.platform === "win32";
|
|
16
|
+
const ext = isWindows ? ".exe" : "";
|
|
17
|
+
|
|
18
|
+
function findBinary() {
|
|
19
|
+
// 1. Check if postinstall already placed the binary
|
|
20
|
+
const localBin = join(__dirname, `zx${ext}`);
|
|
21
|
+
if (existsSync(localBin)) return localBin;
|
|
22
|
+
|
|
23
|
+
// 2. Resolve from the platform-specific optional dependency
|
|
24
|
+
const platformPkgs = {
|
|
25
|
+
"darwin-arm64": "@ziex/cli-darwin-arm64",
|
|
26
|
+
"darwin-x64": "@ziex/cli-darwin-x64",
|
|
27
|
+
"linux-x64": "@ziex/cli-linux-x64",
|
|
28
|
+
"linux-arm64": "@ziex/cli-linux-arm64",
|
|
29
|
+
"win32-x64": "@ziex/cli-win32-x64",
|
|
30
|
+
"win32-arm64": "@ziex/cli-win32-arm64",
|
|
31
|
+
};
|
|
32
|
+
|
|
33
|
+
const pkg = platformPkgs[`${process.platform}-${process.arch}`];
|
|
34
|
+
if (pkg) {
|
|
35
|
+
try {
|
|
36
|
+
const pkgDir = dirname(require.resolve(`${pkg}/package.json`));
|
|
37
|
+
const bin = join(pkgDir, "bin", `zx${ext}`);
|
|
38
|
+
if (existsSync(bin)) return bin;
|
|
39
|
+
} catch {}
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
return null;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
const bin = findBinary();
|
|
46
|
+
if (!bin) {
|
|
47
|
+
console.error(
|
|
48
|
+
"Error: ziex native binary not found. The postinstall script may not have run.",
|
|
49
|
+
);
|
|
50
|
+
console.error("Try reinstalling: npm install -g ziex");
|
|
51
|
+
process.exit(1);
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
try {
|
|
55
|
+
execFileSync(bin, process.argv.slice(2), { stdio: "inherit" });
|
|
56
|
+
} catch (e) {
|
|
57
|
+
if (e.status !== undefined) {
|
|
58
|
+
process.exit(e.status);
|
|
59
|
+
}
|
|
60
|
+
throw e;
|
|
61
|
+
}
|
package/install.cjs
ADDED
|
@@ -0,0 +1,218 @@
|
|
|
1
|
+
// Postinstall script for ziex npm package
|
|
2
|
+
// Resolves the native binary from platform-specific optionalDependencies
|
|
3
|
+
// or falls back to downloading from GitHub releases.
|
|
4
|
+
|
|
5
|
+
const { existsSync, mkdirSync, copyFileSync, chmodSync, createWriteStream, unlinkSync } = require("fs");
|
|
6
|
+
const { execSync } = require("child_process");
|
|
7
|
+
const path = require("path");
|
|
8
|
+
const https = require("https");
|
|
9
|
+
const { createGunzip } = require("zlib");
|
|
10
|
+
|
|
11
|
+
const PLATFORM_MAP = {
|
|
12
|
+
darwin: {
|
|
13
|
+
arm64: { pkg: "@ziex/cli-darwin-arm64", target: "macos-aarch64" },
|
|
14
|
+
x64: { pkg: "@ziex/cli-darwin-x64", target: "macos-x64" },
|
|
15
|
+
},
|
|
16
|
+
linux: {
|
|
17
|
+
x64: { pkg: "@ziex/cli-linux-x64", target: "linux-x64" },
|
|
18
|
+
arm64: { pkg: "@ziex/cli-linux-arm64", target: "linux-aarch64" },
|
|
19
|
+
},
|
|
20
|
+
win32: {
|
|
21
|
+
x64: { pkg: "@ziex/cli-win32-x64", target: "windows-x64" },
|
|
22
|
+
arm64: { pkg: "@ziex/cli-win32-arm64", target: "windows-aarch64" },
|
|
23
|
+
},
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
const GITHUB_REPO = "ziex-dev/ziex";
|
|
27
|
+
|
|
28
|
+
function getPlatformInfo() {
|
|
29
|
+
const os = process.platform;
|
|
30
|
+
const arch = process.arch;
|
|
31
|
+
const info = PLATFORM_MAP[os]?.[arch];
|
|
32
|
+
if (!info) {
|
|
33
|
+
throw new Error(`Unsupported platform: ${os}-${arch}`);
|
|
34
|
+
}
|
|
35
|
+
return info;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
function getVersion() {
|
|
39
|
+
const pkg = require("./package.json");
|
|
40
|
+
return pkg.version;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
function getBinaryName(target) {
|
|
44
|
+
const isWindows = process.platform === "win32";
|
|
45
|
+
return `zx-${target}${isWindows ? ".exe" : ""}`;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
function getOutputPath() {
|
|
49
|
+
const binDir = path.join(__dirname, "bin");
|
|
50
|
+
const isWindows = process.platform === "win32";
|
|
51
|
+
return path.join(binDir, isWindows ? "zx.exe" : "zx");
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
// Try to resolve binary from optionalDependencies
|
|
55
|
+
function tryResolveFromOptionalDep(pkgName) {
|
|
56
|
+
try {
|
|
57
|
+
const pkgPath = require.resolve(`${pkgName}/package.json`);
|
|
58
|
+
const pkgDir = path.dirname(pkgPath);
|
|
59
|
+
const pkgJson = require(pkgPath);
|
|
60
|
+
const binName = pkgJson.bin?.zx || pkgJson.bin?.ziex;
|
|
61
|
+
if (binName) {
|
|
62
|
+
const binPath = path.join(pkgDir, binName);
|
|
63
|
+
if (existsSync(binPath)) {
|
|
64
|
+
return binPath;
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
// Fallback: look for the binary directly
|
|
68
|
+
const isWindows = process.platform === "win32";
|
|
69
|
+
const possibleNames = isWindows ? ["zx.exe"] : ["zx"];
|
|
70
|
+
for (const name of possibleNames) {
|
|
71
|
+
const candidate = path.join(pkgDir, "bin", name);
|
|
72
|
+
if (existsSync(candidate)) return candidate;
|
|
73
|
+
}
|
|
74
|
+
} catch {
|
|
75
|
+
// Package not installed
|
|
76
|
+
}
|
|
77
|
+
return null;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
// Download from GitHub releases
|
|
81
|
+
function downloadFromGitHub(target, version) {
|
|
82
|
+
return new Promise((resolve, reject) => {
|
|
83
|
+
const isWindows = process.platform === "win32";
|
|
84
|
+
const ext = isWindows ? "zip" : "tar.gz";
|
|
85
|
+
const tag = version.startsWith("0.") ? `zx-v${version}` : `zx-v${version}`;
|
|
86
|
+
const url = `https://github.com/${GITHUB_REPO}/releases/download/${tag}/zx-${target}.${ext}`;
|
|
87
|
+
const latestUrl = `https://github.com/${GITHUB_REPO}/releases/latest/download/zx-${target}.${ext}`;
|
|
88
|
+
|
|
89
|
+
const binDir = path.join(__dirname, "bin");
|
|
90
|
+
mkdirSync(binDir, { recursive: true });
|
|
91
|
+
const archivePath = path.join(binDir, `zx-${target}.${ext}`);
|
|
92
|
+
|
|
93
|
+
console.log(`Downloading ziex binary for ${target}...`);
|
|
94
|
+
|
|
95
|
+
function download(downloadUrl, isRetry) {
|
|
96
|
+
const followRedirect = (url) => {
|
|
97
|
+
const proto = url.startsWith("https") ? https : require("http");
|
|
98
|
+
proto
|
|
99
|
+
.get(url, { headers: { "User-Agent": "ziex-npm" } }, (res) => {
|
|
100
|
+
if (res.statusCode >= 300 && res.statusCode < 400 && res.headers.location) {
|
|
101
|
+
followRedirect(res.headers.location);
|
|
102
|
+
return;
|
|
103
|
+
}
|
|
104
|
+
if (res.statusCode !== 200) {
|
|
105
|
+
if (!isRetry) {
|
|
106
|
+
// Retry with latest
|
|
107
|
+
download(latestUrl, true);
|
|
108
|
+
return;
|
|
109
|
+
}
|
|
110
|
+
reject(new Error(`Download failed with status ${res.statusCode}: ${downloadUrl}`));
|
|
111
|
+
return;
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
const file = createWriteStream(archivePath);
|
|
115
|
+
res.pipe(file);
|
|
116
|
+
file.on("finish", () => {
|
|
117
|
+
file.close(() => resolve(archivePath));
|
|
118
|
+
});
|
|
119
|
+
})
|
|
120
|
+
.on("error", reject);
|
|
121
|
+
};
|
|
122
|
+
followRedirect(downloadUrl);
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
download(url, false);
|
|
126
|
+
});
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
function extractTarGz(archivePath, targetBinaryName, outputPath) {
|
|
130
|
+
const binDir = path.dirname(outputPath);
|
|
131
|
+
// Use tar command (available on macOS and Linux)
|
|
132
|
+
execSync(`tar -xzf "${archivePath}" -C "${binDir}"`, { stdio: "pipe" });
|
|
133
|
+
const extractedPath = path.join(binDir, targetBinaryName);
|
|
134
|
+
if (existsSync(extractedPath)) {
|
|
135
|
+
copyFileSync(extractedPath, outputPath);
|
|
136
|
+
unlinkSync(extractedPath);
|
|
137
|
+
}
|
|
138
|
+
unlinkSync(archivePath);
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
function extractZip(archivePath, targetBinaryName, outputPath) {
|
|
142
|
+
const binDir = path.dirname(outputPath);
|
|
143
|
+
execSync(`unzip -o "${archivePath}" -d "${binDir}"`, { stdio: "pipe" });
|
|
144
|
+
const extractedPath = path.join(binDir, targetBinaryName);
|
|
145
|
+
if (existsSync(extractedPath)) {
|
|
146
|
+
copyFileSync(extractedPath, outputPath);
|
|
147
|
+
unlinkSync(extractedPath);
|
|
148
|
+
}
|
|
149
|
+
unlinkSync(archivePath);
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
async function main() {
|
|
153
|
+
const { pkg: pkgName, target } = getPlatformInfo();
|
|
154
|
+
const outputPath = getOutputPath();
|
|
155
|
+
const binDir = path.dirname(outputPath);
|
|
156
|
+
mkdirSync(binDir, { recursive: true });
|
|
157
|
+
|
|
158
|
+
// Step 1: Try to resolve from optional dependency
|
|
159
|
+
const resolvedPath = tryResolveFromOptionalDep(pkgName);
|
|
160
|
+
if (resolvedPath) {
|
|
161
|
+
console.log(`Found ziex binary from ${pkgName}`);
|
|
162
|
+
copyFileSync(resolvedPath, outputPath);
|
|
163
|
+
chmodSync(outputPath, 0o755);
|
|
164
|
+
|
|
165
|
+
// Create ziex alias (symlink or copy)
|
|
166
|
+
createAliases(outputPath);
|
|
167
|
+
return;
|
|
168
|
+
}
|
|
169
|
+
|
|
170
|
+
// Step 2: Download from GitHub releases
|
|
171
|
+
console.log(`Platform package ${pkgName} not found, downloading from GitHub...`);
|
|
172
|
+
try {
|
|
173
|
+
const version = getVersion();
|
|
174
|
+
const archivePath = await downloadFromGitHub(target, version);
|
|
175
|
+
const binaryName = getBinaryName(target);
|
|
176
|
+
const isWindows = process.platform === "win32";
|
|
177
|
+
|
|
178
|
+
if (isWindows) {
|
|
179
|
+
extractZip(archivePath, binaryName, outputPath);
|
|
180
|
+
} else {
|
|
181
|
+
extractTarGz(archivePath, binaryName, outputPath);
|
|
182
|
+
}
|
|
183
|
+
|
|
184
|
+
chmodSync(outputPath, 0o755);
|
|
185
|
+
createAliases(outputPath);
|
|
186
|
+
console.log("ziex binary installed successfully!");
|
|
187
|
+
} catch (err) {
|
|
188
|
+
console.error(`Failed to install ziex binary: ${err.message}`);
|
|
189
|
+
console.error("You can install it manually from: https://ziex.dev/install");
|
|
190
|
+
process.exit(1);
|
|
191
|
+
}
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
function createAliases(zxPath) {
|
|
195
|
+
const binDir = path.dirname(zxPath);
|
|
196
|
+
const isWindows = process.platform === "win32";
|
|
197
|
+
const ziexPath = path.join(binDir, isWindows ? "ziex.exe" : "ziex");
|
|
198
|
+
|
|
199
|
+
// The main binary is `zx`, create `ziex` as a copy/symlink
|
|
200
|
+
try {
|
|
201
|
+
if (existsSync(ziexPath) && ziexPath !== zxPath) unlinkSync(ziexPath);
|
|
202
|
+
if (ziexPath !== zxPath) {
|
|
203
|
+
try {
|
|
204
|
+
const fs = require("fs");
|
|
205
|
+
fs.symlinkSync(path.basename(zxPath), ziexPath);
|
|
206
|
+
} catch {
|
|
207
|
+
copyFileSync(zxPath, ziexPath);
|
|
208
|
+
}
|
|
209
|
+
}
|
|
210
|
+
} catch {
|
|
211
|
+
// Non-critical
|
|
212
|
+
}
|
|
213
|
+
}
|
|
214
|
+
|
|
215
|
+
main().catch((err) => {
|
|
216
|
+
console.error(err.message);
|
|
217
|
+
process.exit(1);
|
|
218
|
+
});
|
package/package.json
CHANGED
|
@@ -1,9 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "ziex",
|
|
3
|
-
"version": "0.1.0-dev.
|
|
3
|
+
"version": "0.1.0-dev.865",
|
|
4
4
|
"description": "ZX is a framework for building web applications with Zig.",
|
|
5
|
-
"main": "index.
|
|
5
|
+
"main": "src/index.ts",
|
|
6
6
|
"type": "module",
|
|
7
|
+
"bin": {
|
|
8
|
+
"ziex": "bin/ziex",
|
|
9
|
+
"zx": "bin/ziex"
|
|
10
|
+
},
|
|
7
11
|
"exports": {
|
|
8
12
|
".": "./index.js",
|
|
9
13
|
"./react": "./react/index.js",
|
|
@@ -32,14 +36,15 @@
|
|
|
32
36
|
],
|
|
33
37
|
"author": "Nurul Huda (Apon) <me@nurulhudaapon.com>",
|
|
34
38
|
"license": "MIT",
|
|
35
|
-
"
|
|
36
|
-
"
|
|
37
|
-
"optional": true
|
|
38
|
-
},
|
|
39
|
-
"react-dom": {
|
|
40
|
-
"optional": true
|
|
41
|
-
}
|
|
39
|
+
"scripts": {
|
|
40
|
+
"postinstall": "node install.cjs"
|
|
42
41
|
},
|
|
43
|
-
"
|
|
44
|
-
|
|
42
|
+
"optionalDependencies": {
|
|
43
|
+
"@ziex/cli-darwin-arm64": "0.1.0-dev.865",
|
|
44
|
+
"@ziex/cli-darwin-x64": "0.1.0-dev.865",
|
|
45
|
+
"@ziex/cli-linux-x64": "0.1.0-dev.865",
|
|
46
|
+
"@ziex/cli-linux-arm64": "0.1.0-dev.865",
|
|
47
|
+
"@ziex/cli-win32-x64": "0.1.0-dev.865",
|
|
48
|
+
"@ziex/cli-win32-arm64": "0.1.0-dev.865"
|
|
49
|
+
}
|
|
45
50
|
}
|
package/README.md
DELETED
|
@@ -1,195 +0,0 @@
|
|
|
1
|
-
<p align="center">
|
|
2
|
-
<img src="https://raw.githubusercontent.com/ziex-dev/branding/main/banner.svg" alt="Ziex banner" width="100%" />
|
|
3
|
-
</p>
|
|
4
|
-
|
|
5
|
-
A full-stack web framework for Zig. Write declarative UI components using familiar JSX patterns, transpiled to efficient Zig code.
|
|
6
|
-
|
|
7
|
-
Ziex combines the power and performance of Zig with the expressiveness of JSX, enabling you to build fast, type-safe web applications.
|
|
8
|
-
|
|
9
|
-
**[Documentation →](https://ziex.dev/learn)**
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
> **Note:** Most of the API and syntax are finalized and stable, and server-side rendering (SSR) features are production-ready, Ziex continues to evolve with ongoing improvements to client-side rendering and state management. You can start using the documented features today, as they are stable and unlikely to change. Areas still under development are not yet documented and will be added as they mature.
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
## Installation
|
|
17
|
-
|
|
18
|
-
##### Linux/macOS
|
|
19
|
-
```bash
|
|
20
|
-
curl -fsSL https://ziex.dev/install | bash
|
|
21
|
-
```
|
|
22
|
-
|
|
23
|
-
##### Windows
|
|
24
|
-
```powershell
|
|
25
|
-
powershell -c "irm ziex.dev/install.ps1 | iex"
|
|
26
|
-
|
|
27
|
-
```
|
|
28
|
-
##### Installing Zig
|
|
29
|
-
```bash
|
|
30
|
-
brew install zig # macOS
|
|
31
|
-
winget install -e --id zig.zig # Windows
|
|
32
|
-
```
|
|
33
|
-
[_See for other platforms →_](https://ziglang.org/learn/getting-started/)
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
## At a Glance
|
|
37
|
-
|
|
38
|
-
```tsx site/pages/examples/playground.zx
|
|
39
|
-
pub fn Playground(allocator: zx.Allocator) zx.Component {
|
|
40
|
-
const is_loading = true;
|
|
41
|
-
var i: usize = 0;
|
|
42
|
-
|
|
43
|
-
return (
|
|
44
|
-
<main @allocator={allocator}>
|
|
45
|
-
<h1>Hello, Ziex!</h1>
|
|
46
|
-
|
|
47
|
-
{for (users) |user| (
|
|
48
|
-
<Profile name={user.name} age={user.age} role={user.role} />
|
|
49
|
-
)}
|
|
50
|
-
|
|
51
|
-
{if (is_loading) (<p>Loading...</p>) else (<p>Loaded</p>)}
|
|
52
|
-
|
|
53
|
-
{while (i < 5) : (i += 1) (<i>{i}</i>)}
|
|
54
|
-
</main>
|
|
55
|
-
);
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
fn Profile(ctx: *zx.ComponentCtx(User)) zx.Component {
|
|
59
|
-
return (
|
|
60
|
-
<div @allocator={ctx.allocator}>
|
|
61
|
-
<h3>{ctx.props.name}</h3>
|
|
62
|
-
<div>{ctx.props.age}</div>
|
|
63
|
-
<strong>
|
|
64
|
-
{switch (ctx.props.role) {
|
|
65
|
-
.admin => "Admin",
|
|
66
|
-
.member => "Member",
|
|
67
|
-
}}
|
|
68
|
-
</strong>
|
|
69
|
-
</div>
|
|
70
|
-
);
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
const User = struct { name: []const u8, age: u32, role: enum { admin, member } };
|
|
74
|
-
|
|
75
|
-
const users = [_]User{
|
|
76
|
-
.{ .name = "John", .age = 20, .role = .admin },
|
|
77
|
-
.{ .name = "Jane", .age = 21, .role = .member },
|
|
78
|
-
};
|
|
79
|
-
|
|
80
|
-
const zx = @import("zx");
|
|
81
|
-
```
|
|
82
|
-
|
|
83
|
-
Try this in [Playground →](https://ziex.dev/playground#data=eF59U01vnDAQ_StTTtAiyGZVqSKAEuVSVa2USy8NUUTAu2sJbGQgoUv83ztjlo-y2_rCfLx5zMyze-uhSH_vlWxF7h07K7Cq9gV2AuawnRaFzNJGqgCOnXc3eg5597KspGCigT4RgCeTom6A18-FTHMu9hBBo1p2M2RfUwU8gLbmR4aZKwwPCcWaVgmwB49OWKZcwO3086ifTB3PMAM9bOKvDLMu_OKs-xD6GBiZx9PvpAK7rZmqHXin7_vydxPXg5I7XjAQacminnAemRrS_eijpUHJYvTJ1OCvunL0WQt8B_a8GgfssIq_D47neaFfxQ6womZTguUmeM70dqAebQ4hfHYgIOtTBBui5HHPdehzUzYWhD6t89Shg2s3lKTzMK6dNV0AH5eK3jed_RPHcy4LfUGxnL_-JRhyev8RbRsbRKVkVQ87RuG2axiSLnG0-9Cn4ApXN0qK_SpKp6_feJMdwJ5JSDBnHGR9vDQv8eZFMSTWHZmJ5f4DWbLyhakB-sPYF7Far3r1z5pdjjTJM7wl0gDfCpa0GW7fXMwAHp-GbPvFpZuJb2p77ZpLGQATbYlAM4cLpyY16JuZ1LwDZH18fiL-0yq8HowQmEisb_JAowOtHAPXV2gSP9qnFWn3Ulkq2LJssygbW8G6ZTPHDpO3HC-YauzEOnaJRTuw9B927V4U)
|
|
84
|
-
|
|
85
|
-
<details>
|
|
86
|
-
<summary>Explanation of this</summary>
|
|
87
|
-
|
|
88
|
-
```tsx site/pages/examples/playground.zx
|
|
89
|
-
// A Zig function that returns a `zx.Component`.
|
|
90
|
-
pub fn Playground(allocator: zx.Allocator) zx.Component {
|
|
91
|
-
const is_loading = true;
|
|
92
|
-
var i: usize = 0;
|
|
93
|
-
|
|
94
|
-
// HTML Block is always surrounded by parentheses and can contain HTML elements and control flow statements.
|
|
95
|
-
return (
|
|
96
|
-
// @allocator or any other attribute starting with `@` is called builtin attribute
|
|
97
|
-
// `@allocator` is used to specify the allocator for the component and its children for mem allocation.
|
|
98
|
-
<main @allocator={allocator}>
|
|
99
|
-
<h1>Hello, Ziex!</h1>
|
|
100
|
-
|
|
101
|
-
// `for` loop to iterate over `users` array and render a `Profile` component for each user.
|
|
102
|
-
// Since this is an expression the HTMLs are inside parenteses not curly braces.
|
|
103
|
-
{for (users) |user| (
|
|
104
|
-
// `Profile` component is called with props: name, age, and role.
|
|
105
|
-
// Optional props can be omitted, and the component will receive default values for them.
|
|
106
|
-
<Profile name={user.name} age={user.age} role={user.role} />
|
|
107
|
-
)}
|
|
108
|
-
|
|
109
|
-
// `if` statement works just like other control flow statements.
|
|
110
|
-
{if (is_loading) (<p>Loading...</p>) else (<p>Loaded</p>)}
|
|
111
|
-
|
|
112
|
-
// `while` loop with an optional increment statement.
|
|
113
|
-
{while (i < 5) : (i += 1) (<i>{i}</i>)}
|
|
114
|
-
</main>
|
|
115
|
-
);
|
|
116
|
-
}
|
|
117
|
-
|
|
118
|
-
// A Ziex Component is a Zig function that returns a `zx.Component`.
|
|
119
|
-
// It can have signatures like:
|
|
120
|
-
// - `pub fn ComponentName(allocator: zx.Allocator) zx.Component`
|
|
121
|
-
// - `pub fn ComponentName(ctx: *zx.ComponentCtx<PropsType>) zx.Component`
|
|
122
|
-
// - `pub fn ComponentName(allocator: zx.Allocator, props: PropsType) zx.Component`
|
|
123
|
-
fn Profile(ctx: *zx.ComponentCtx(User)) zx.Component {
|
|
124
|
-
return (
|
|
125
|
-
<div @allocator={ctx.allocator}>
|
|
126
|
-
// Exrepssion starts with `{` and ends with `}`. You can use it to access props, call functions, any valid Zig expression
|
|
127
|
-
<h3>{ctx.props.name}</h3>
|
|
128
|
-
<div>{ctx.props.age}</div>
|
|
129
|
-
<strong>
|
|
130
|
-
{switch (ctx.props.role) {
|
|
131
|
-
.admin => "Admin",
|
|
132
|
-
.member => "Member",
|
|
133
|
-
}}
|
|
134
|
-
</strong>
|
|
135
|
-
</div>
|
|
136
|
-
);
|
|
137
|
-
}
|
|
138
|
-
|
|
139
|
-
const User = struct { name: []const u8, age: u32, role: enum { admin, member } };
|
|
140
|
-
|
|
141
|
-
const users = [_]User{
|
|
142
|
-
.{ .name = "John", .age = 20, .role = .admin },
|
|
143
|
-
.{ .name = "Jane", .age = 21, .role = .member },
|
|
144
|
-
};
|
|
145
|
-
|
|
146
|
-
const zx = @import("zx");
|
|
147
|
-
```
|
|
148
|
-
|
|
149
|
-
</details>
|
|
150
|
-
|
|
151
|
-
## Features
|
|
152
|
-
- **JSX-like Syntax**: Write declarative UI components using familiar JSX patterns, transpiled to efficient Zig code.
|
|
153
|
-
- **Full-Stack Capabilities**: Build both frontend and backend of your web application using
|
|
154
|
-
- **It's Fast**: Significantly faster at SSR than many other frameworks.
|
|
155
|
-
- **Compile-time Safety**: Zig's type system catches bugs at compile time. No runtime surprises, no GC.
|
|
156
|
-
- **Familiar Syntax**: Familiar JSX-like syntax, or plain HTML-style markup, with full access to Zig's control flow.
|
|
157
|
-
- **Server-side Rendering**: Render per request on the server for dynamic data, auth, and personalized pages for best performance and SEO.
|
|
158
|
-
- **Static Site Generation**: Pre-render pages at build/export time into static HTML for fast CDN delivery.
|
|
159
|
-
- **File System Routing**: Folder structure defines routes. No configs, no magic strings, just files in folders.
|
|
160
|
-
- **Client-side Rendering**: Optional client-side rendering for interactive experiences when you need it.
|
|
161
|
-
- **Control Flow in Zig's Syntax**: if/else, for/while, and switch all work as expected. It's just Zig.
|
|
162
|
-
- **Developer Tooling**: CLI, hot reload, and editor extensions for the best DX.
|
|
163
|
-
|
|
164
|
-
## Roadmap
|
|
165
|
-
|
|
166
|
-
We track our feature roadmap and bugs using GitHub Issues.
|
|
167
|
-
You can view our current progress and planned features here:
|
|
168
|
-
|
|
169
|
-
**[Check out the Ziex Issue Tracker →](https://github.com/ziex-dev/ziex/issues)**
|
|
170
|
-
|
|
171
|
-
## Editor Support
|
|
172
|
-
|
|
173
|
-
* [VSCode](https://marketplace.visualstudio.com/items?itemName=ziex.ziex)/[VSCode Forks](https://open-vsx.org/extension/ziex/ziex) Extension
|
|
174
|
-
* [Neovim](/ide/neovim/)
|
|
175
|
-
* [Helix](/ide/helix/)
|
|
176
|
-
* [Zed](/ide/zed/)
|
|
177
|
-
|
|
178
|
-
## Community
|
|
179
|
-
|
|
180
|
-
- [Discord](https://ziex.dev/r/discord)
|
|
181
|
-
- [Topic on Ziggit](https://ziex.dev/r/ziggit)
|
|
182
|
-
- [Project on Zig Discord Community](https://ziex.dev/r/zig-discord) (Join Zig Discord first: https://discord.gg/zig)
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
## Links
|
|
186
|
-
|
|
187
|
-
* [Codeberg Mirror](https://codeberg.org/ziex/ziex) - ZX repository mirror on Codeberg
|
|
188
|
-
* [ziex.dev](https://github.com/ziex-dev/ziex/tree/main/site) - Official documentation site of ZX made using ZX.
|
|
189
|
-
* [example-blog](https://github.com/ziex-dev/example-blog) - Demo blog web application built with ZX
|
|
190
|
-
* [zx-numbers-game](https://github.com/Andrew-Velox/zx-numbers-game) - ZX numbers game
|
|
191
|
-
* [Comparision with other frameworks](https://ziex.dev/vs)
|
|
192
|
-
|
|
193
|
-
## Contributing
|
|
194
|
-
|
|
195
|
-
Contributions are welcome! Currently trying out ZX and reporting issues for edge cases and providing feedback are greatly appreciated.
|
package/app.d.ts
DELETED
|
@@ -1,112 +0,0 @@
|
|
|
1
|
-
import type { DurableObjectNamespace } from "./runtime";
|
|
2
|
-
import type { KVNamespace } from "./kv";
|
|
3
|
-
import type { WASI } from "./wasi";
|
|
4
|
-
/**
|
|
5
|
-
* Anything that can be resolved to a `WebAssembly.Module`:
|
|
6
|
-
* - `WebAssembly.Module` — already compiled (Cloudflare Workers, wrangler)
|
|
7
|
-
* - `ArrayBuffer` / `ArrayBufferView` — raw WASM bytes
|
|
8
|
-
* - `Response` — a fetch() response whose body is the WASM binary
|
|
9
|
-
* - `string` — an HTTP(S) URL or an absolute file path (Bun)
|
|
10
|
-
* - `URL` — a URL object
|
|
11
|
-
*/
|
|
12
|
-
export type WasmInput = WebAssembly.Module | ArrayBuffer | ArrayBufferView | Response | string | URL;
|
|
13
|
-
/**
|
|
14
|
-
* Resolve any supported WASM input to a compiled `WebAssembly.Module`.
|
|
15
|
-
* The result is NOT cached here — cache it at the call site if needed.
|
|
16
|
-
*/
|
|
17
|
-
export declare function resolveModule(input: WasmInput): Promise<WebAssembly.Module>;
|
|
18
|
-
/** Keys of `Env` whose value extends {@link KVNamespace}. */
|
|
19
|
-
type KVKey<Env> = {
|
|
20
|
-
[K in keyof Env]: Env[K] extends KVNamespace ? K : never;
|
|
21
|
-
}[keyof Env];
|
|
22
|
-
/** Keys of `Env` whose value extends {@link DurableObjectNamespace}. */
|
|
23
|
-
type DOKey<Env> = {
|
|
24
|
-
[K in keyof Env]: Env[K] extends DurableObjectNamespace ? K : never;
|
|
25
|
-
}[keyof Env];
|
|
26
|
-
type ZiexOptions<Env> = {
|
|
27
|
-
/** WASM module — accepts any {@link WasmInput}. Resolved and cached on first request. */
|
|
28
|
-
module: WasmInput;
|
|
29
|
-
/** Optional pre-configured WASI instance. */
|
|
30
|
-
wasi?: WASI;
|
|
31
|
-
/** Extra WASM import namespaces. */
|
|
32
|
-
imports?: (mem: () => WebAssembly.Memory) => Record<string, Record<string, unknown>>;
|
|
33
|
-
/**
|
|
34
|
-
* KV namespace bindings. Two forms are supported:
|
|
35
|
-
*
|
|
36
|
-
* - **Env key**: a single key from `Env` whose value is a `KVNamespace` — used as the `"default"` binding.
|
|
37
|
-
* - **Name map**: `{ [bindingName]: envKey }` — map namespace names to env keys.
|
|
38
|
-
*
|
|
39
|
-
* @example Single env key (becomes the "default" binding)
|
|
40
|
-
* ```ts
|
|
41
|
-
* kv: "MY_KV"
|
|
42
|
-
* ```
|
|
43
|
-
* @example Name map
|
|
44
|
-
* ```ts
|
|
45
|
-
* kv: { default: "MY_KV", users: "USERS_KV" }
|
|
46
|
-
* ```
|
|
47
|
-
*/
|
|
48
|
-
kv?: KVKey<Env> | Record<string, KVKey<Env>>;
|
|
49
|
-
/**
|
|
50
|
-
* Env key whose value is a `DurableObjectNamespace` for WebSocket pub/sub.
|
|
51
|
-
* Requires `createWebSocketDO` export on the worker.
|
|
52
|
-
*
|
|
53
|
-
* @example
|
|
54
|
-
* ```ts
|
|
55
|
-
* websocket: "ChatRoom"
|
|
56
|
-
* ```
|
|
57
|
-
*/
|
|
58
|
-
websocket?: DOKey<Env>;
|
|
59
|
-
};
|
|
60
|
-
/**
|
|
61
|
-
* Main Ziex application class. Mirrors the Hono API style — construct once,
|
|
62
|
-
* export as default, and the runtime calls `fetch` for you.
|
|
63
|
-
*
|
|
64
|
-
* Works on Cloudflare Workers, Bun, and Vercel Edge out of the box.
|
|
65
|
-
*
|
|
66
|
-
* @example Cloudflare Workers / wrangler
|
|
67
|
-
* ```ts
|
|
68
|
-
* import { Ziex } from "ziex";
|
|
69
|
-
* import module from "./app.wasm";
|
|
70
|
-
*
|
|
71
|
-
* const app = new Ziex<Env>({
|
|
72
|
-
* module,
|
|
73
|
-
* kv: (env) => ({ default: env.KV }),
|
|
74
|
-
* });
|
|
75
|
-
* export default app;
|
|
76
|
-
* ```
|
|
77
|
-
*
|
|
78
|
-
* @example Bun
|
|
79
|
-
* ```ts
|
|
80
|
-
* import { Ziex } from "ziex";
|
|
81
|
-
* import wasmPath from "./app.wasm" with { type: "wasm" };
|
|
82
|
-
*
|
|
83
|
-
* const app = new Ziex({ module: wasmPath });
|
|
84
|
-
* export default app;
|
|
85
|
-
* ```
|
|
86
|
-
*
|
|
87
|
-
* @example Vercel Edge
|
|
88
|
-
* ```ts
|
|
89
|
-
* import { Ziex } from "ziex";
|
|
90
|
-
* import { handle } from "ziex/vercel";
|
|
91
|
-
*
|
|
92
|
-
* const app = new Ziex({ module: "https://example.com/app.wasm" });
|
|
93
|
-
* export default handle(app);
|
|
94
|
-
* ```
|
|
95
|
-
*/
|
|
96
|
-
export declare class Ziex<Env = Record<string, unknown>> {
|
|
97
|
-
private readonly options;
|
|
98
|
-
private resolved;
|
|
99
|
-
constructor(options: ZiexOptions<Env>);
|
|
100
|
-
private getModule;
|
|
101
|
-
private resolveKV;
|
|
102
|
-
/**
|
|
103
|
-
* Fetch handler called by the runtime on every request.
|
|
104
|
-
*
|
|
105
|
-
* Arrow function so `this` is always the class instance, even when the
|
|
106
|
-
* runtime extracts `fetch` from the exported object (e.g. Bun).
|
|
107
|
-
*/
|
|
108
|
-
fetch: (request: Request, env: Env, ctx?: {
|
|
109
|
-
waitUntil(p: Promise<unknown>): void;
|
|
110
|
-
}) => Promise<Response>;
|
|
111
|
-
}
|
|
112
|
-
export {};
|