jac-client 0.2.10__py3-none-any.whl → 0.2.12__py3-none-any.whl

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.
Files changed (85) hide show
  1. jac_client/examples/all-in-one/button.jac +4 -3
  2. jac_client/examples/all-in-one/components/CategoryFilter.jac +36 -24
  3. jac_client/examples/all-in-one/components/Header.jac +12 -8
  4. jac_client/examples/all-in-one/components/ProfitOverview.jac +49 -35
  5. jac_client/examples/all-in-one/components/Summary.jac +59 -36
  6. jac_client/examples/all-in-one/components/TransactionForm.jac +142 -112
  7. jac_client/examples/all-in-one/components/TransactionItem.jac +37 -30
  8. jac_client/examples/all-in-one/components/TransactionList.jac +33 -26
  9. jac_client/examples/all-in-one/components/button.jac +4 -3
  10. jac_client/examples/all-in-one/components/navigation.jac +111 -117
  11. jac_client/examples/all-in-one/constants/categories.jac +23 -24
  12. jac_client/examples/all-in-one/constants/clients.jac +7 -8
  13. jac_client/examples/all-in-one/context/BudgetContext.jac +9 -6
  14. jac_client/examples/all-in-one/hooks/useBudget.jac +18 -12
  15. jac_client/examples/all-in-one/hooks/useLocalStorage.jac +14 -13
  16. jac_client/examples/all-in-one/main.jac +340 -371
  17. jac_client/examples/all-in-one/pages/BudgetPlanner.jac +19 -12
  18. jac_client/examples/all-in-one/pages/FeaturesTest.jac +31 -15
  19. jac_client/examples/all-in-one/pages/LandingPage.jac +113 -90
  20. jac_client/examples/all-in-one/pages/budget_planner_ui.cl.jac +34 -39
  21. jac_client/examples/all-in-one/pages/features_test_ui.cl.jac +464 -352
  22. jac_client/examples/all-in-one/pages/loginPage.jac +114 -119
  23. jac_client/examples/all-in-one/pages/nestedDemo.jac +43 -50
  24. jac_client/examples/all-in-one/pages/notFound.jac +14 -15
  25. jac_client/examples/all-in-one/pages/signupPage.jac +113 -119
  26. jac_client/examples/all-in-one/utils/formatters.jac +5 -8
  27. jac_client/examples/asset-serving/css-with-image/main.jac +77 -73
  28. jac_client/examples/asset-serving/image-asset/main.jac +47 -46
  29. jac_client/examples/asset-serving/import-alias/main.jac +93 -95
  30. jac_client/examples/basic/main.jac +17 -15
  31. jac_client/examples/basic-auth/main.jac +246 -254
  32. jac_client/examples/basic-auth-with-router/main.jac +272 -285
  33. jac_client/examples/basic-full-stack/main.jac +245 -242
  34. jac_client/examples/css-styling/js-styling/main.jac +41 -62
  35. jac_client/examples/css-styling/material-ui/main.jac +90 -90
  36. jac_client/examples/css-styling/pure-css/main.jac +35 -44
  37. jac_client/examples/css-styling/sass-example/main.jac +35 -44
  38. jac_client/examples/css-styling/styled-components/main.jac +38 -47
  39. jac_client/examples/css-styling/tailwind-example/main.jac +54 -43
  40. jac_client/examples/full-stack-with-auth/main.jac +407 -433
  41. jac_client/examples/little-x/main.jac +306 -344
  42. jac_client/examples/little-x/src/submit-button.jac +15 -14
  43. jac_client/examples/nested-folders/nested-advance/main.jac +18 -27
  44. jac_client/examples/nested-folders/nested-advance/src/ButtonRoot.jac +4 -6
  45. jac_client/examples/nested-folders/nested-advance/src/level1/ButtonSecondL.jac +9 -13
  46. jac_client/examples/nested-folders/nested-advance/src/level1/Card.jac +29 -32
  47. jac_client/examples/nested-folders/nested-advance/src/level1/level2/ButtonThirdL.jac +12 -18
  48. jac_client/examples/nested-folders/nested-basic/main.jac +7 -5
  49. jac_client/examples/nested-folders/nested-basic/src/button.jac +4 -3
  50. jac_client/examples/nested-folders/nested-basic/src/components/button.jac +4 -3
  51. jac_client/examples/ts-support/main.jac +26 -26
  52. jac_client/examples/with-router/main.jac +186 -223
  53. jac_client/plugin/client_runtime.cl.jac +5 -3
  54. jac_client/plugin/impl/client_runtime.impl.jac +1 -1
  55. jac_client/plugin/plugin_config.jac +53 -99
  56. jac_client/plugin/src/__init__.jac +0 -2
  57. jac_client/plugin/src/compiler.jac +0 -1
  58. jac_client/plugin/src/impl/compiler.impl.jac +49 -17
  59. jac_client/plugin/src/impl/jac_to_js.impl.jac +5 -1
  60. jac_client/plugin/src/impl/package_installer.impl.jac +20 -20
  61. jac_client/plugin/src/impl/vite_bundler.impl.jac +146 -84
  62. jac_client/plugin/src/targets/impl/desktop_target.impl.jac +54 -41
  63. jac_client/plugin/utils/__init__.jac +3 -0
  64. jac_client/plugin/utils/bun_installer.jac +16 -0
  65. jac_client/plugin/utils/client_deps.jac +14 -0
  66. jac_client/plugin/utils/impl/bun_installer.impl.jac +99 -0
  67. jac_client/plugin/utils/impl/client_deps.impl.jac +73 -0
  68. jac_client/templates/client.jacpack +0 -4
  69. jac_client/templates/fullstack.jacpack +1 -5
  70. jac_client/tests/conftest.py +56 -41
  71. jac_client/tests/fixtures/spawn_test/app.jac +49 -52
  72. jac_client/tests/fixtures/with-ts/app.jac +27 -27
  73. jac_client/tests/test_cli.py +71 -6
  74. jac_client/tests/test_helpers.py +11 -18
  75. jac_client/tests/test_it.py +1 -1
  76. {jac_client-0.2.10.dist-info → jac_client-0.2.12.dist-info}/METADATA +5 -5
  77. jac_client-0.2.12.dist-info/RECORD +115 -0
  78. {jac_client-0.2.10.dist-info → jac_client-0.2.12.dist-info}/WHEEL +1 -1
  79. jac_client/plugin/src/babel_processor.jac +0 -18
  80. jac_client/plugin/src/impl/babel_processor.impl.jac +0 -89
  81. jac_client/plugin/utils/impl/node_installer.impl.jac +0 -249
  82. jac_client/plugin/utils/node_installer.jac +0 -41
  83. jac_client-0.2.10.dist-info/RECORD +0 -115
  84. {jac_client-0.2.10.dist-info → jac_client-0.2.12.dist-info}/entry_points.txt +0 -0
  85. {jac_client-0.2.10.dist-info → jac_client-0.2.12.dist-info}/top_level.txt +0 -0
jac_client/examples/basic-auth/main.jac CHANGED
@@ -1,21 +1,24 @@
1
1
  # Simple Authentication App with Jac Client Utils
2
- cl import from react {
3
- useState,
4
- useEffect
2
+ cl import from '@jac/runtime' {
3
+ jacSignup,
4
+ jacLogin,
5
+ jacLogout,
6
+ jacIsLoggedIn
5
7
  }
6
- cl import from '@jac-client/utils' { jacSignup, jacLogin, jacLogout, jacIsLoggedIn }
7
8
 
8
9
  cl {
9
10
  def:pub app -> any {
10
- has isLoggedIn: bool = False;
11
- has isSignup: bool = False;
12
- has username: str = "";
13
- has password: str = "";
14
- has error: str = "";
15
- has loading: bool = False;
11
+ has isLoggedIn: bool = False,
12
+ isSignup: bool = False,
13
+ username: str = "",
14
+ password: str = "",
15
+ error: str = "",
16
+ loading: bool = False;
16
17
 
17
18
  # Check login status on mount
18
- useEffect(lambda -> None{ isLoggedIn = jacIsLoggedIn();} , []);
19
+ can with entry {
20
+ isLoggedIn = jacIsLoggedIn();
21
+ }
19
22
 
20
23
  # Handle login
21
24
  async def handleLogin -> None {
@@ -80,292 +83,281 @@ cl {
80
83
 
81
84
  # Logged in view - Dashboard
82
85
  if isLoggedIn {
83
- return <div
84
- style={{
85
- "minHeight": "100vh",
86
- "background": "linear-gradient(135deg, #667eea 0%, #764ba2 100%)",
87
- "display": "flex",
88
- "alignItems": "center",
89
- "justifyContent": "center",
90
- "fontFamily": "system-ui, -apple-system, sans-serif"
91
- }}
92
- >
86
+ return
93
87
  <div
94
88
  style={{
95
- "background": "#ffffff",
96
- "borderRadius": "16px",
97
- "padding": "48px",
98
- "boxShadow": "0 20px 60px rgba(0,0,0,0.3)",
99
- "maxWidth": "500px",
100
- "width": "90%",
101
- "textAlign": "center"
89
+ "minHeight": "100vh",
90
+ "background": "linear-gradient(135deg, #667eea 0%, #764ba2 100%)",
91
+ "display": "flex",
92
+ "alignItems": "center",
93
+ "justifyContent": "center",
94
+ "fontFamily": "system-ui, -apple-system, sans-serif"
102
95
  }}
103
96
  >
104
- <h1
105
- style={{
106
- "fontSize": "2.5rem",
107
- "marginBottom": "16px",
108
- "color": "#1f2937",
109
- "fontWeight": "700"
110
- }}
111
- >
112
- ✅ Welcome!
113
- </h1>
114
- <p
115
- style={{
116
- "fontSize": "1.1rem",
117
- "color": "#6b7280",
118
- "marginBottom": "32px"
119
- }}
120
- >
121
- You are successfully logged in
122
- </p>
123
97
  <div
124
98
  style={{
125
- "background": "#f3f4f6",
126
- "padding": "24px",
127
- "borderRadius": "12px",
128
- "marginBottom": "32px"
99
+ "background": "#ffffff",
100
+ "borderRadius": "16px",
101
+ "padding": "48px",
102
+ "boxShadow": "0 20px 60px rgba(0,0,0,0.3)",
103
+ "maxWidth": "500px",
104
+ "width": "90%",
105
+ "textAlign": "center"
129
106
  }}
130
107
  >
108
+ <h1
109
+ style={{
110
+ "fontSize": "2.5rem",
111
+ "marginBottom": "16px",
112
+ "color": "#1f2937",
113
+ "fontWeight": "700"
114
+ }}
115
+ >
116
+ ✅ Welcome!
117
+ </h1>
131
118
  <p
132
119
  style={{
133
- "fontSize": "0.9rem",
120
+ "fontSize": "1.1rem",
134
121
  "color": "#6b7280",
135
- "marginBottom": "8px"
122
+ "marginBottom": "32px"
136
123
  }}
137
124
  >
138
- Logged in as:
125
+ You are successfully logged in
139
126
  </p>
140
- <p
127
+ <div
128
+ style={{
129
+ "background": "#f3f4f6",
130
+ "padding": "24px",
131
+ "borderRadius": "12px",
132
+ "marginBottom": "32px"
133
+ }}
134
+ >
135
+ <p
136
+ style={{
137
+ "fontSize": "0.9rem",
138
+ "color": "#6b7280",
139
+ "marginBottom": "8px"
140
+ }}
141
+ >
142
+ Logged in as:
143
+ </p>
144
+ <p
145
+ style={{
146
+ "fontSize": "1.2rem",
147
+ "fontWeight": "600",
148
+ "color": "#667eea"
149
+ }}
150
+ >
151
+ User
152
+ </p>
153
+ </div>
154
+ <button
155
+ onClick={handleLogout}
141
156
  style={{
142
- "fontSize": "1.2rem",
157
+ "width": "100%",
158
+ "padding": "14px 24px",
159
+ "background": "#ef4444",
160
+ "color": "#ffffff",
161
+ "border": "none",
162
+ "borderRadius": "10px",
163
+ "fontSize": "16px",
143
164
  "fontWeight": "600",
144
- "color": "#667eea"
165
+ "cursor": "pointer",
166
+ "transition": "all 0.3s",
167
+ "boxShadow": "0 4px 12px rgba(239,68,68,0.3)"
145
168
  }}
146
169
  >
147
- User
148
- </p>
170
+ Logout
171
+ </button>
149
172
  </div>
150
- <button
151
- onClick={handleLogout}
152
- style={{
153
- "width": "100%",
154
- "padding": "14px 24px",
155
- "background": "#ef4444",
156
- "color": "#ffffff",
157
- "border": "none",
158
- "borderRadius": "10px",
159
- "fontSize": "16px",
160
- "fontWeight": "600",
161
- "cursor": "pointer",
162
- "transition": "all 0.3s",
163
- "boxShadow": "0 4px 12px rgba(239,68,68,0.3)"
164
- }}
165
- >
166
- Logout
167
- </button>
168
- </div>
169
- </div>;
173
+ </div>;
170
174
  }
171
175
 
172
176
  # Login/Signup view
173
- return <div
174
- style={{
175
- "minHeight": "100vh",
176
- "background": "linear-gradient(135deg, #667eea 0%, #764ba2 100%)",
177
- "display": "flex",
178
- "alignItems": "center",
179
- "justifyContent": "center",
180
- "fontFamily": "system-ui, -apple-system, sans-serif",
181
- "padding": "20px"
182
- }}
183
- >
177
+ return
184
178
  <div
185
179
  style={{
186
- "background": "#ffffff",
187
- "borderRadius": "16px",
188
- "padding": "48px",
189
- "boxShadow": "0 20px 60px rgba(0,0,0,0.3)",
190
- "maxWidth": "400px",
191
- "width": "100%"
180
+ "minHeight": "100vh",
181
+ "background": "linear-gradient(135deg, #667eea 0%, #764ba2 100%)",
182
+ "display": "flex",
183
+ "alignItems": "center",
184
+ "justifyContent": "center",
185
+ "fontFamily": "system-ui, -apple-system, sans-serif",
186
+ "padding": "20px"
192
187
  }}
193
188
  >
194
- # Header
195
189
  <div
196
- style={{"textAlign": "center", "marginBottom": "32px"}}
197
- >
198
- <h1
199
- style={{
200
- "fontSize": "2rem",
201
- "fontWeight": "700",
202
- "color": "#1f2937",
203
- "marginBottom": "8px"
204
- }}
205
- >
206
- {("Create Account" if isSignup else "Welcome Back")}
207
- </h1>
208
- <p
209
- style={{"color": "#6b7280", "fontSize": "0.95rem"}}
210
- >
211
- {(
212
- "Sign up to get started"
213
- if isSignup
214
- else "Sign in to continue"
215
- )}
216
- </p>
217
- </div>
218
- # Form
219
- <form
220
- onSubmit={handleSubmit}
221
- style={{"marginBottom": "24px"}}
190
+ style={{
191
+ "background": "#ffffff",
192
+ "borderRadius": "16px",
193
+ "padding": "48px",
194
+ "boxShadow": "0 20px 60px rgba(0,0,0,0.3)",
195
+ "maxWidth": "400px",
196
+ "width": "100%"
197
+ }}
222
198
  >
223
- <div
224
- style={{"marginBottom": "20px"}}
225
- >
226
- <label
199
+ # Header
200
+ <div style={{"textAlign": "center", "marginBottom": "32px"}}>
201
+ <h1
227
202
  style={{
228
- "display": "block",
229
- "marginBottom": "8px",
230
- "color": "#374151",
231
- "fontSize": "14px",
232
- "fontWeight": "600"
203
+ "fontSize": "2rem",
204
+ "fontWeight": "700",
205
+ "color": "#1f2937",
206
+ "marginBottom": "8px"
233
207
  }}
234
208
  >
235
- Username
236
- </label>
237
- <input
238
- type="text"
239
- value={username}
240
- onChange={lambda e: any -> None{ username = e.target.value;} }
241
- placeholder="Enter your username"
209
+ {("Create Account" if isSignup else "Welcome Back")}
210
+ </h1>
211
+ <p style={{"color": "#6b7280", "fontSize": "0.95rem"}}>
212
+ {(
213
+ "Sign up to get started"
214
+ if isSignup
215
+ else "Sign in to continue"
216
+ )}
217
+ </p>
218
+ </div>
219
+ # Form
220
+ <form onSubmit={handleSubmit} style={{"marginBottom": "24px"}}>
221
+ <div style={{"marginBottom": "20px"}}>
222
+ <label
223
+ style={{
224
+ "display": "block",
225
+ "marginBottom": "8px",
226
+ "color": "#374151",
227
+ "fontSize": "14px",
228
+ "fontWeight": "600"
229
+ }}
230
+ >
231
+ Username
232
+ </label>
233
+ <input
234
+ type="text"
235
+ value={username}
236
+ onChange={lambda e: any -> None { username = e.target.value;}}
237
+ placeholder="Enter your username"
238
+ style={{
239
+ "width": "100%",
240
+ "padding": "12px 16px",
241
+ "border": "2px solid #e5e7eb",
242
+ "borderRadius": "10px",
243
+ "fontSize": "16px",
244
+ "outline": "none",
245
+ "transition": "border 0.2s",
246
+ "boxSizing": "border-box"
247
+ }}
248
+ />
249
+ </div>
250
+ <div style={{"marginBottom": "24px"}}>
251
+ <label
252
+ style={{
253
+ "display": "block",
254
+ "marginBottom": "8px",
255
+ "color": "#374151",
256
+ "fontSize": "14px",
257
+ "fontWeight": "600"
258
+ }}
259
+ >
260
+ Password
261
+ </label>
262
+ <input
263
+ type="password"
264
+ value={password}
265
+ onChange={lambda e: any -> None { password = e.target.value;}}
266
+ placeholder="Enter your password"
267
+ style={{
268
+ "width": "100%",
269
+ "padding": "12px 16px",
270
+ "border": "2px solid #e5e7eb",
271
+ "borderRadius": "10px",
272
+ "fontSize": "16px",
273
+ "outline": "none",
274
+ "transition": "border 0.2s",
275
+ "boxSizing": "border-box"
276
+ }}
277
+ />
278
+ </div>
279
+ {(
280
+ <div
281
+ style={{
282
+ "padding": "12px",
283
+ "background": "#fee2e2",
284
+ "border": "1px solid #fecaca",
285
+ "borderRadius": "8px",
286
+ "marginBottom": "20px"
287
+ }}
288
+ >
289
+ <p
290
+ style={{
291
+ "color": "#dc2626",
292
+ "fontSize": "14px",
293
+ "margin": "0"
294
+ }}
295
+ >
296
+ {error}
297
+ </p>
298
+ </div>
299
+ )
300
+ if error
301
+ else None}
302
+ <button
303
+ type="submit"
304
+ disabled={loading}
242
305
  style={{
243
306
  "width": "100%",
244
- "padding": "12px 16px",
245
- "border": "2px solid #e5e7eb",
307
+ "padding": "14px 24px",
308
+ "background": (("#9ca3af" if loading else "#667eea")),
309
+ "color": "#ffffff",
310
+ "border": "none",
246
311
  "borderRadius": "10px",
247
312
  "fontSize": "16px",
248
- "outline": "none",
249
- "transition": "border 0.2s",
250
- "boxSizing": "border-box"
313
+ "fontWeight": "600",
314
+ "cursor": (("not-allowed" if loading else "pointer")),
315
+ "transition": "all 0.3s",
316
+ "boxShadow": "0 4px 12px rgba(102,126,234,0.4)"
251
317
  }}
252
- />
253
- </div>
254
- <div
255
- style={{"marginBottom": "24px"}}
256
- >
257
- <label
318
+ >
319
+ {(
320
+ (
321
+ "Processing..."
322
+ if loading
323
+ else ("Sign Up" if isSignup else "Sign In")
324
+ )
325
+ )}
326
+ </button>
327
+ </form>
328
+ # Toggle between login/signup
329
+ <div style={{"textAlign": "center"}}>
330
+ <p
258
331
  style={{
259
- "display": "block",
260
- "marginBottom": "8px",
261
- "color": "#374151",
332
+ "color": "#6b7280",
262
333
  "fontSize": "14px",
263
- "fontWeight": "600"
334
+ "marginBottom": "8px"
264
335
  }}
265
336
  >
266
- Password
267
- </label>
268
- <input
269
- type="password"
270
- value={password}
271
- onChange={lambda e: any -> None{ password = e.target.value;} }
272
- placeholder="Enter your password"
273
- style={{
274
- "width": "100%",
275
- "padding": "12px 16px",
276
- "border": "2px solid #e5e7eb",
277
- "borderRadius": "10px",
278
- "fontSize": "16px",
279
- "outline": "none",
280
- "transition": "border 0.2s",
281
- "boxSizing": "border-box"
282
- }}
283
- />
284
- </div>
285
- {(
286
- <div
337
+ {(
338
+ (
339
+ "Already have an account?"
340
+ if isSignup
341
+ else "Don't have an account?"
342
+ )
343
+ )}
344
+ </p>
345
+ <button
346
+ onClick={lambda -> None { isSignup = not isSignup;error = "";username = "";password = "";}}
287
347
  style={{
288
- "padding": "12px",
289
- "background": "#fee2e2",
290
- "border": "1px solid #fecaca",
291
- "borderRadius": "8px",
292
- "marginBottom": "20px"
348
+ "background": "none",
349
+ "border": "none",
350
+ "color": "#667eea",
351
+ "fontSize": "14px",
352
+ "fontWeight": "600",
353
+ "cursor": "pointer",
354
+ "textDecoration": "underline"
293
355
  }}
294
356
  >
295
- <p
296
- style={{
297
- "color": "#dc2626",
298
- "fontSize": "14px",
299
- "margin": "0"
300
- }}
301
- >
302
- {error}
303
- </p>
304
- </div>
305
- )
306
- if error
307
- else None}
308
- <button
309
- type="submit"
310
- disabled={loading}
311
- style={{
312
- "width": "100%",
313
- "padding": "14px 24px",
314
- "background": (("#9ca3af" if loading else "#667eea")),
315
- "color": "#ffffff",
316
- "border": "none",
317
- "borderRadius": "10px",
318
- "fontSize": "16px",
319
- "fontWeight": "600",
320
- "cursor": (("not-allowed" if loading else "pointer")),
321
- "transition": "all 0.3s",
322
- "boxShadow": "0 4px 12px rgba(102,126,234,0.4)"
323
- }}
324
- >
325
- {(
326
- (
327
- "Processing..."
328
- if loading
329
- else ("Sign Up" if isSignup else "Sign In")
330
- )
331
- )}
332
- </button>
333
- </form>
334
- # Toggle between login/signup
335
- <div
336
- style={{"textAlign": "center"}}
337
- >
338
- <p
339
- style={{
340
- "color": "#6b7280",
341
- "fontSize": "14px",
342
- "marginBottom": "8px"
343
- }}
344
- >
345
- {(
346
- (
347
- "Already have an account?"
348
- if isSignup
349
- else "Don't have an account?"
350
- )
351
- )}
352
- </p>
353
- <button
354
- onClick={lambda -> None{ isSignup = not isSignup; error = ""; username = ""; password = "";} }
355
- style={{
356
- "background": "none",
357
- "border": "none",
358
- "color": "#667eea",
359
- "fontSize": "14px",
360
- "fontWeight": "600",
361
- "cursor": "pointer",
362
- "textDecoration": "underline"
363
- }}
364
- >
365
- {(("Sign In" if isSignup else "Create Account"))}
366
- </button>
357
+ {(("Sign In" if isSignup else "Create Account"))}
358
+ </button>
359
+ </div>
367
360
  </div>
368
- </div>
369
- </div>;
361
+ </div>;
370
362
  }
371
363
  }