jac-client 0.1.0__py3-none-any.whl → 0.2.1__py3-none-any.whl

jac_client/examples/full-stack-with-auth/package.json

@@ -0,0 +1,28 @@
+{
+  "name": "full-stack-with-auth",
+  "version": "1.0.0",
+  "main": "index.js",
+  "scripts": {
+    "build": "npm run compile && vite build",
+    "dev": "vite dev",
+    "preview": "vite preview",
+    "compile": "babel src --out-dir build --extensions \".jsx,.js\" --out-file-extension .js"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "description": "Jac application: full-stack-with-auth",
+  "type": "module",
+  "devDependencies": {
+    "vite": "^6.4.1",
+    "@babel/cli": "^7.28.3",
+    "@babel/core": "^7.28.5",
+    "@babel/preset-env": "^7.28.5",
+    "@babel/preset-react": "^7.28.5"
+  },
+  "dependencies": {
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0",
+    "react-router-dom": "^6.30.1"
+  }
+}

jac_client/examples/full-stack-with-auth/vite.config.js

@@ -0,0 +1,30 @@
+
+import { defineConfig } from "vite";
+import path from "path";
+import { fileURLToPath } from "url";
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
+export default defineConfig({
+  root: ".", // base folder
+  build: {
+    rollupOptions: {
+      input: "build/main.js", // your compiled entry file
+      output: {
+        entryFileNames: "client.[hash].js", // name of the final js file
+        assetFileNames: "[name].[ext]",
+      },
+    },
+    outDir: "dist", // final bundled output
+    emptyOutDir: true,
+    minify: false,
+    sourcemap: true,
+  },
+  publicDir: false,
+  resolve: {
+    alias: {
+      "@jac-client/utils": path.resolve(__dirname, "src/client_runtime.js"),
+    },
+  },
+});
+

jac_client/examples/with-router/.babelrc

@@ -0,0 +1,9 @@
+
+{
+    "presets": [[
+        "@babel/preset-env",
+        {
+            "modules": false
+        }
+    ], "@babel/preset-react"]
+}

jac_client/examples/with-router/README.md

@@ -0,0 +1,17 @@
+# my-app
+
+make sure node modules are installed:
+```bash
+npm install
+```
+
+
+## Running Jac Code
+
+To run your Jac code, use the Jac CLI:
+
+```bash
+jac serve app.jac
+```
+
+Happy coding with Jac!

jac_client/examples/with-router/app.jac

@@ -0,0 +1,323 @@
+# React Router HashRouter Example
+cl import from react { useState, useEffect }
+cl import from "@jac-client/utils" {
+    Router,
+    Routes,
+    Route,
+    Link,
+    useNavigate,
+    useLocation,
+    useParams
+}
+
+cl {
+    # Home Page Component
+    def Home()  -> any {
+        location = useLocation();
+        navigate = useNavigate();
+
+        def goToAbout(e: any) -> None {
+            navigate("/about");
+        }
+
+        return <div>
+            <h1>
+                🏠 Home Page
+            </h1>
+            <p>
+                Welcome to the home page!
+            </p>
+            <p>
+                This example uses React Router's
+                <strong>
+                    HashRouter
+                </strong>
+                #  for client-side routing.
+            </p>
+            <p>
+                Current path:
+                <code>
+                    {location.pathname}
+                </code>
+            </p>
+            <button
+                onClick={goToAbout}
+            >
+                Go to About →
+            </button>
+        </div>;
+    }
+
+    # About Page Component
+    def About()  -> any {
+        location = useLocation();
+
+        return <div>
+            <h1>
+                ℹ️ About Page
+            </h1>
+            <p>
+                This is the about page.
+            </p>
+            <p>
+                Learn more about our application here.
+            </p>
+            <p>
+                Current path:
+                <code>
+                    {location.pathname}
+                </code>
+            </p>
+            <div
+                style={{"marginTop": "1rem"}}
+            >
+                <Link to="/about/team">
+                    View Team →
+                </Link>
+            </div>
+        </div>;
+    }
+
+    # Team Page Component (nested route example)
+    def Team()  -> any {
+        return <div>
+            <h1>
+                👥 Our Team
+            </h1>
+            <p>
+                Meet the amazing team behind this project!
+            </p>
+            <Link to="/about">
+                ← Back to About
+            </Link>
+        </div>;
+    }
+
+    # User Profile Component (with URL parameters)
+    def UserProfile()  -> any {
+        params = useParams();
+        userId = params.id if params.id else "Unknown";
+
+        return <div>
+            <h1>
+                👤 User Profile
+            </h1>
+            <p>
+                Viewing profile for user:
+                <strong>
+                    {userId}
+                </strong>
+            </p>
+            <p>
+                This demonstrates URL parameters using
+                <code>
+                    /user/:id
+                </code>
+            </p>
+            <Link to="/">
+                ← Back to Home
+            </Link>
+        </div>;
+    }
+
+    # Contact Page Component
+    def Contact()  -> any {
+        [submitted, setSubmitted] = useState(False);
+
+        def handleSubmit(e: any) -> None {
+            e.preventDefault();
+            setSubmitted(True);
+        }
+
+        def resetForm(e: any) -> None {
+            setSubmitted(False);
+        }
+
+        if submitted {
+            return <div>
+                <h1>
+                    📧 Contact Page
+                </h1>
+                <div
+                    style={{"color": "green"}}
+                >
+                    <p>
+                        ✓ Thank you! Your message has been sent.
+                    </p>
+                    <button
+                        onClick={resetForm}
+                    >
+                        Send another
+                    </button>
+                </div>
+            </div>;
+        }
+
+        return <div>
+            <h1>
+                📧 Contact Page
+            </h1>
+            <p>
+                Get in touch with us!
+            </p>
+            <form
+                onSubmit={handleSubmit}
+            >
+                <input
+                    type="text"
+                    placeholder="Your name"
+                    style={{"margin": "0.5rem 0", "display": "block"}}
+                />
+                <input
+                    type="email"
+                    placeholder="Your email"
+                    style={{"margin": "0.5rem 0", "display": "block"}}
+                />
+                <textarea
+                    placeholder="Your message"
+                    style={{"margin": "0.5rem 0", "display": "block"}}
+                ></textarea>
+                <button type="submit">
+                    Send Message
+                </button>
+            </form>
+        </div>;
+    }
+
+    # 404 Not Found Component
+    def NotFound()  -> any {
+        location = useLocation();
+        navigate = useNavigate();
+
+        def goHome(e: any) -> None {
+            navigate("/");
+        }
+
+        return <div
+            style={{"textAlign": "center", "padding": "2rem"}}
+        >
+            <h1>
+                🔍 404 - Page Not Found
+            </h1>
+            <p>
+                The page
+                <code>
+                    {location.pathname}
+                </code>
+                 does not exist.
+            </p>
+            <button
+                onClick={goHome}
+            >
+                Go Home
+            </button>
+        </div>;
+    }
+
+    # Navigation Component with active link styling
+    def Navigation()  -> any {
+        location = useLocation();
+
+        def linkStyle(path: str) -> dict {
+            isActive = location.pathname == path;
+            return {
+                "padding": "0.5rem 1rem",
+                "textDecoration": "none",
+                "color": "#0066cc" if isActive else "#333",
+                "fontWeight": "bold" if isActive else "normal",
+                "backgroundColor": "#e3f2fd" if isActive else "transparent",
+                "borderRadius": "4px",
+                "display": "inline-block"
+            };
+        }
+
+        return <nav
+            style={{
+                "padding": "1rem",
+                "backgroundColor": "#f5f5f5",
+                "marginBottom": "2rem",
+                "boxShadow": "0 2px 4px rgba(0,0,0,0.1)"
+            }}
+        >
+            <div
+                style={{
+                    "maxWidth": "1200px",
+                    "margin": "0 auto",
+                    "display": "flex",
+                    "gap": "1rem",
+                    "alignItems": "center"
+                }}
+            >
+                <Link
+                    to="/"
+                    style={linkStyle("/")}
+                >
+                    Home
+                </Link>
+                <Link
+                    to="/about"
+                    style={linkStyle("/about")}
+                >
+                    About
+                </Link>
+                <Link
+                    to="/contact"
+                    style={linkStyle("/contact")}
+                >
+                    Contact
+                </Link>
+                <Link
+                    to="/user/123"
+                    style={linkStyle("/user/123")}
+                >
+                    Profile Demo
+                </Link>
+            </div>
+        </nav>;
+    }
+
+    # Main App Component with React Router HashRouter
+    def app()  -> any {
+        return <Router>
+            <div
+                style={{"fontFamily": "system-ui, -apple-system, sans-serif"}}
+            >
+                <Navigation />
+                <div
+                    style={{
+                        "maxWidth": "1200px",
+                        "margin": "0 auto",
+                        "padding": "0 1rem"
+                    }}
+                >
+                    <Routes>
+                        <Route
+                            path="/"
+                            element={<Home />}
+                        />
+                        <Route
+                            path="/about"
+                            element={<About />}
+                        />
+                        <Route
+                            path="/about/team"
+                            element={<Team />}
+                        />
+                        <Route
+                            path="/contact"
+                            element={<Contact />}
+                        />
+                        <Route
+                            path="/user/:id"
+                            element={<UserProfile />}
+                        />
+                        <Route
+                            path="*"
+                            element={<NotFound />}
+                        />
+                    </Routes>
+                </div>
+            </div>
+        </Router>;
+    }
+}

jac_client/examples/with-router/package.json

@@ -0,0 +1,28 @@
+{
+  "name": "my-app",
+  "version": "1.0.0",
+  "main": "index.js",
+  "scripts": {
+    "build": "npm run compile && vite build",
+    "dev": "vite dev",
+    "preview": "vite preview",
+    "compile": "babel src --out-dir build --extensions \".jsx,.js\" --out-file-extension .js"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "description": "Jac application: my-app",
+  "type": "module",
+  "devDependencies": {
+    "vite": "^6.4.1",
+    "@babel/cli": "^7.28.3",
+    "@babel/core": "^7.28.5",
+    "@babel/preset-env": "^7.28.5",
+    "@babel/preset-react": "^7.28.5"
+  },
+  "dependencies": {
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0",
+    "react-router-dom": "^6.30.1"
+  }
+}

jac_client/examples/with-router/vite.config.js

@@ -0,0 +1,28 @@
+
+import { defineConfig } from "vite";
+import path from "path";
+import { fileURLToPath } from "url";
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
+export default defineConfig({
+  root: ".", // base folder
+  build: {
+    rollupOptions: {
+      input: "build/main.js", // your compiled entry file
+      output: {
+        entryFileNames: "client.[hash].js", // name of the final js file
+        assetFileNames: "[name].[ext]",
+      },
+    },
+    outDir: "dist", // final bundled output
+    emptyOutDir: true,
+  },
+  publicDir: false,
+  resolve: {
+    alias: {
+      "@jac-client/utils": path.resolve(__dirname, "src/client_runtime.js"),
+    },
+  },
+});
+