@reactful/create 0.0.58 → 0.0.60

Sign up to get free protection for your applications and to get access to all the features.
Files changed (76) hide show
  1. package/index.js +2 -14
  2. package/package.json +3 -4
  3. package/bun.lockb +0 -0
  4. package/common/package.json +0 -22
  5. package/common/tsconfig.json +0 -24
  6. package/templates/empty/index.html +0 -12
  7. package/templates/empty/index.ts +0 -5
  8. package/templates/minimal/index.html +0 -12
  9. package/templates/minimal/index.ts +0 -5
  10. package/templates/sampling/apis/auth/db.ts +0 -15
  11. package/templates/sampling/apis/auth/index.ts +0 -28
  12. package/templates/sampling/apis/hello.ts +0 -3
  13. package/templates/sampling/apis/quotes.ts +0 -16
  14. package/templates/sampling/apis/sub/index.ts +0 -3
  15. package/templates/sampling/apis/sub/sub.ts +0 -3
  16. package/templates/sampling/assets/SLIDEME.png +0 -0
  17. package/templates/sampling/assets/default.css +0 -91
  18. package/templates/sampling/assets/favicon.ico +0 -0
  19. package/templates/sampling/assets/icon.png +0 -0
  20. package/templates/sampling/assets/icon.svg +0 -6
  21. package/templates/sampling/assets/logo-144.png +0 -0
  22. package/templates/sampling/assets/logo-168.png +0 -0
  23. package/templates/sampling/assets/logo-192.png +0 -0
  24. package/templates/sampling/assets/logo-48.png +0 -0
  25. package/templates/sampling/assets/logo-512.png +0 -0
  26. package/templates/sampling/assets/logo-72.png +0 -0
  27. package/templates/sampling/assets/logo-96.png +0 -0
  28. package/templates/sampling/assets/manifest.json +0 -57
  29. package/templates/sampling/assets/markdown.css +0 -274
  30. package/templates/sampling/assets/robots.txt +0 -1
  31. package/templates/sampling/assets/system.css +0 -7
  32. package/templates/sampling/builds/about.html +0 -27
  33. package/templates/sampling/builds/bundle.js +0 -13116
  34. package/templates/sampling/builds/bundle.ts +0 -25
  35. package/templates/sampling/builds/client.ts +0 -1
  36. package/templates/sampling/builds/clock.html +0 -30
  37. package/templates/sampling/builds/counter.html +0 -30
  38. package/templates/sampling/builds/forms/form.html +0 -48
  39. package/templates/sampling/builds/forms/index.html +0 -48
  40. package/templates/sampling/builds/hello.html +0 -60
  41. package/templates/sampling/builds/htmlx.html +0 -24
  42. package/templates/sampling/builds/htmlx.tsx +0 -13
  43. package/templates/sampling/builds/index.html +0 -98
  44. package/templates/sampling/builds/login.html +0 -45
  45. package/templates/sampling/builds/profile/index.html +0 -54
  46. package/templates/sampling/builds/quotes.html +0 -26
  47. package/templates/sampling/builds/shared.js +0 -76
  48. package/templates/sampling/builds/system.html +0 -27
  49. package/templates/sampling/components/header.tsx +0 -7
  50. package/templates/sampling/directives/index.ts +0 -1
  51. package/templates/sampling/directives/shown.ts +0 -6
  52. package/templates/sampling/index.html +0 -20
  53. package/templates/sampling/index.ts +0 -19
  54. package/templates/sampling/routes/about.html +0 -13
  55. package/templates/sampling/routes/clock.tsx +0 -35
  56. package/templates/sampling/routes/counter.tsx +0 -21
  57. package/templates/sampling/routes/forms/form.css +0 -19
  58. package/templates/sampling/routes/forms/form.tsx +0 -51
  59. package/templates/sampling/routes/forms/index.tsx +0 -3
  60. package/templates/sampling/routes/hello.tsx +0 -62
  61. package/templates/sampling/routes/htmlx.html +0 -15
  62. package/templates/sampling/routes/index.md +0 -15
  63. package/templates/sampling/routes/login.tsx +0 -36
  64. package/templates/sampling/routes/profile/detail.css +0 -13
  65. package/templates/sampling/routes/profile/detail.tsx +0 -48
  66. package/templates/sampling/routes/profile/index.tsx +0 -14
  67. package/templates/sampling/routes/profile/profile.css +0 -8
  68. package/templates/sampling/routes/profile/tester.tsx +0 -11
  69. package/templates/sampling/routes/quotes.tsx +0 -25
  70. package/templates/sampling/routes/system.tsx +0 -23
  71. package/templates/sampling/tests/access.spec.ts +0 -29
  72. package/templates/sampling/tests/counter.spec.ts +0 -19
  73. package/templates/sampling/tests/form.spec.ts +0 -51
  74. package/templates/sampling/tests/hello.spec.ts +0 -25
  75. package/templates/sampling/tests/path.test.ts +0 -20
  76. package/tsconfig.json +0 -22
@@ -1,76 +0,0 @@
1
-
2
- const GLOBAL_KEY = Symbol.for('settings')
3
- const process = { env: {
4
- "NODE_ENV": "development",
5
- "SHELL": "/usr/bin/zsh",
6
- "LSCOLORS": "Gxfxcxdxbxegedabagacad",
7
- "USER_ZDOTDIR": "/root",
8
- "COLORTERM": "truecolor",
9
- "LESS": "-R",
10
- "NVM_INC": "/root/.nvm/versions/node/v21.5.0/include/node",
11
- "WSL2_GUI_APPS_ENABLED": "1",
12
- "TERM_PROGRAM_VERSION": "1.86.2",
13
- "WSL_DISTRO_NAME": "Debian",
14
- "NODE": "/root/.nvm/versions/node/v21.5.0/bin/node",
15
- "npm_config_local_prefix": "/mnt/b/Repositorios/reactful/",
16
- "NAME": "JSR-DESKTOP",
17
- "PWD": "/mnt/b/Repositorios/reactful",
18
- "LOGNAME": "root",
19
- "PORT": "3333",
20
- "_": "/root/.bun/bin/bun",
21
- "VSCODE_GIT_ASKPASS_NODE": "/root/.vscode-server/bin/903b1e9d8990623e3d7da1df3d33db3e42d80eda/node",
22
- "VSCODE_INJECTION": "1",
23
- "HOME": "/root",
24
- "LANG": "en_US.UTF-8",
25
- "WSL_INTEROP": "/run/WSL/280_interop",
26
- "LS_COLORS": "rs=0:di=01;34:ln=01;36:mh=00:pi=40;33:so=01;35:do=01;35:bd=40;33;01:cd=40;33;01:or=40;31;01:mi=00:su=37;41:sg=30;43:ca=30;41:tw=30;42:ow=34;42:st=37;44:ex=01;32:*.tar=01;31:*.tgz=01;31:*.arc=01;31:*.arj=01;31:*.taz=01;31:*.lha=01;31:*.lz4=01;31:*.lzh=01;31:*.lzma=01;31:*.tlz=01;31:*.txz=01;31:*.tzo=01;31:*.t7z=01;31:*.zip=01;31:*.z=01;31:*.dz=01;31:*.gz=01;31:*.lrz=01;31:*.lz=01;31:*.lzo=01;31:*.xz=01;31:*.zst=01;31:*.tzst=01;31:*.bz2=01;31:*.bz=01;31:*.tbz=01;31:*.tbz2=01;31:*.tz=01;31:*.deb=01;31:*.rpm=01;31:*.jar=01;31:*.war=01;31:*.ear=01;31:*.sar=01;31:*.rar=01;31:*.alz=01;31:*.ace=01;31:*.zoo=01;31:*.cpio=01;31:*.7z=01;31:*.rz=01;31:*.cab=01;31:*.wim=01;31:*.swm=01;31:*.dwm=01;31:*.esd=01;31:*.jpg=01;35:*.jpeg=01;35:*.mjpg=01;35:*.mjpeg=01;35:*.gif=01;35:*.bmp=01;35:*.pbm=01;35:*.pgm=01;35:*.ppm=01;35:*.tga=01;35:*.xbm=01;35:*.xpm=01;35:*.tif=01;35:*.tiff=01;35:*.png=01;35:*.svg=01;35:*.svgz=01;35:*.mng=01;35:*.pcx=01;35:*.mov=01;35:*.mpg=01;35:*.mpeg=01;35:*.m2v=01;35:*.mkv=01;35:*.webm=01;35:*.webp=01;35:*.ogm=01;35:*.mp4=01;35:*.m4v=01;35:*.mp4v=01;35:*.vob=01;35:*.qt=01;35:*.nuv=01;35:*.wmv=01;35:*.asf=01;35:*.rm=01;35:*.rmvb=01;35:*.flc=01;35:*.avi=01;35:*.fli=01;35:*.flv=01;35:*.gl=01;35:*.dl=01;35:*.xcf=01;35:*.xwd=01;35:*.yuv=01;35:*.cgm=01;35:*.emf=01;35:*.ogv=01;35:*.ogx=01;35:*.aac=00;36:*.au=00;36:*.flac=00;36:*.m4a=00;36:*.mid=00;36:*.midi=00;36:*.mka=00;36:*.mp3=00;36:*.mpc=00;36:*.ogg=00;36:*.ra=00;36:*.wav=00;36:*.oga=00;36:*.opus=00;36:*.spx=00;36:*.xspf=00;36:",
27
- "WAYLAND_DISPLAY": "wayland-0",
28
- "GIT_ASKPASS": "/root/.vscode-server/bin/903b1e9d8990623e3d7da1df3d33db3e42d80eda/extensions/git/dist/askpass.sh",
29
- "NVM_DIR": "/root/.nvm",
30
- "VSCODE_GIT_ASKPASS_EXTRA_ARGS": "",
31
- "TERM": "xterm-256color",
32
- "npm_package_name": "reactful",
33
- "ZSH": "/root/.oh-my-zsh",
34
- "ZDOTDIR": "/root",
35
- "USER": "root",
36
- "VSCODE_GIT_IPC_HANDLE": "/run/user/0/vscode-git-7034020a55.sock",
37
- "DISPLAY": ":0",
38
- "npm_lifecycle_event": "start",
39
- "SHLVL": "1",
40
- "NVM_CD_FLAGS": "-q",
41
- "PAGER": "less",
42
- "npm_config_user_agent": "bun/1.0.25 npm/? node/v21.6.0 linux x64",
43
- "npm_execpath": "/root/.bun/bin/bun",
44
- "XDG_RUNTIME_DIR": "/run/user/0/",
45
- "MINIFY": "false",
46
- "WSLENV": "VSCODE_WSL_EXT_LOCATION/up",
47
- "npm_package_json": "/mnt/b/Repositorios/reactful/package.json",
48
- "BUN_INSTALL": "/root/.bun",
49
- "VSCODE_GIT_ASKPASS_MAIN": "/root/.vscode-server/bin/903b1e9d8990623e3d7da1df3d33db3e42d80eda/extensions/git/dist/askpass-main.js",
50
- "PATH": "/mnt/b/Repositorios/reactful/node_modules/.bin:/mnt/b/Repositorios/reactful/node_modules/.bin:/mnt/b/Repositorios/node_modules/.bin:/mnt/b/node_modules/.bin:/mnt/node_modules/.bin:/node_modules/.bin:/root/.deno/bin:/root/.bun/bin:/root/.vscode-server/bin/903b1e9d8990623e3d7da1df3d33db3e42d80eda/bin/remote-cli:/root/.nvm/versions/node/v21.5.0/bin:/root/.deno/bin:/root/.bun/bin:/root/.cargo/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games:/usr/lib/wsl/lib:/mnt/c/Program Files/Common Files/Oracle/Java/javapath:/mnt/c/Users/Jonathan/AppData/Local/Programs/Python/Python38/Scripts/:/mnt/c/Users/Jonathan/AppData/Local/Programs/Python/Python38/:/mnt/c/Program Files (x86)/VMware/VMware Player/bin/:/mnt/c/Python310/Scripts/:/mnt/c/Python310/:/mnt/c/Users/Jonathan/AppData/Roaming/ActiveState/bin:/mnt/c/Python38/Scripts/:/mnt/c/Python38/:/mnt/c/Windows:/mnt/c/Windows/system32:/mnt/c/Windows/System32/Wbem:/mnt/c/Windows/System32/WindowsPowerShell/v1.0/:/mnt/c/Windows/System32/OpenSSH/:/mnt/c/Program Files (x86)/NVIDIA Corporation/PhysX/Common:/mnt/c/Program Files/NVIDIA Corporation/NVIDIA NvDLISR:/mnt/c/ProgramData/chocolatey/bin:/mnt/c/Users/Jonathan/AppData/Roaming/npm:/mnt/c/Program Files (x86)/Microsoft SQL Server/100/Tools/Binn/VSShell/Common7/IDE/:/mnt/c/Program Files (x86)/Microsoft SQL Server/100/Tools/Binn/:/mnt/c/Program Files/Microsoft SQL Server/100/Tools/Binn/:/mnt/c/Program Files (x86)/Microsoft SQL Server/100/DTS/Binn/:/mnt/c/Program Files/Microsoft SQL Server/100/DTS/Binn/:/mnt/c/Program Files/Git/cmd:/mnt/c/Program Files/Azure Data Studio/bin:/mnt/c/ProgramData/nvm:/mnt/c/Program Files/dotnet/:/mnt/c/WINDOWS/system32:/mnt/c/WINDOWS:/mnt/c/WINDOWS/System32/Wbem:/mnt/c/WINDOWS/System32/WindowsPowerShell/v1.0/:/mnt/c/WINDOWS/System32/OpenSSH/:/mnt/c/Program Files/Microsoft SQL Server/150/Tools/Binn/:/mnt/c/Program Files/Microsoft SQL Server/Client SDK/ODBC/170/Tools/Binn/:/mnt/c/ProgramData/nvm:/mnt/c/Program Files/nodejs:/mnt/c/Program Files/Docker/Docker/resources/bin:/mnt/c/Program Files/PowerShell/7/:/mnt/c/Users/Jonathan/.cargo/bin:/mnt/c/Users/Jonathan/AppData/Local/ActiveState/StateTool/release/bin:/mnt/c/Users/Jonathan/AppData/Local/activestate/cache/bin:/mnt/c/Users/Jonathan/AppData/Local/Android/Sdk/platform-tools:/mnt/c/Users/Jonathan/AppData/Local/Android/Sdk/tools:/mnt/c/Program Files/Azure Data Studio/bin:/mnt/c/Users/Jonathan/AppData/Local/Programs/Microsoft VS Code/bin:/mnt/c/ProgramData/nvm:/mnt/c/Program Files/nodejs:/mnt/c/Users/Jonathan/.dotnet/tools:/mnt/a/Profile/OneDrive/Recursos/scripts/git:/mnt/c/Users/Jonathan/AppData/Local/Google/Cloud SDK/google-cloud-sdk/bin:/mnt/c/tools/mysql/current/bin:/mnt/b/Portaveis/sonar/bin:/mnt/b/Portaveis/Tools:/mnt/c/Program Files/dotnet:/mnt/c/WINDOWS/system32:/mnt/c/Users/Jonathan/AppData/Local/Microsoft/WindowsApps:/mnt/b/Portaveis/Scripts:/mnt/c/Program Files/heroku/bin:/mnt/c/ProgramData/chocolatey/lib/deno:/mnt/c/Users/Jonathan/.deno/bin:/mnt/c/Users/Jonathan/.bun/bin",
51
- "DBUS_SESSION_BUS_ADDRESS": "unix:path=/run/user/0/bus",
52
- "NVM_BIN": "/root/.nvm/versions/node/v21.5.0/bin",
53
- "HOSTTYPE": "x86_64",
54
- "PULSE_SERVER": "unix:/mnt/wslg/PulseServer",
55
- "npm_node_execpath": "/root/.nvm/versions/node/v21.5.0/bin/node",
56
- "OLDPWD": "/mnt/b/Repositorios/reactful",
57
- "TERM_PROGRAM": "vscode",
58
- "VSCODE_IPC_HOOK_CLI": "/run/user/0/vscode-ipc-a2e19b00-9c0c-4603-ba6b-932fcb38a290.sock"
59
- } }
60
-
61
- globalThis[GLOBAL_KEY] ||= { queryId:'#root' }
62
- globalThis[GLOBAL_KEY].renders=[{ 'path': '/mnt/b/Repositorios/reactful/experiments/routes/clock.tsx', 'name': 'default$', 'time': '', 'mode': 'dynamic', 'href': '/mnt/b/Repositorios/reactful/experiments/routes/clock.tsx'},{ 'path': '/mnt/b/Repositorios/reactful/experiments/routes/quotes.tsx', 'name': 'Quotes', 'time': 1800000, 'mode': 'periodic', 'href': '/mnt/b/Repositorios/reactful/experiments/routes/quotes.tsx'}];
63
- globalThis[GLOBAL_KEY].caching=[{ 'call': '', 'data': { 'description': 'Time zone clock...', 'title': 'Time Zone' }, 'path': '/mnt/b/Repositorios/reactful/experiments/routes/clock.tsx', 'name': 'default$', 'type': 'meta'},{ 'call': '', 'data': { 'description': '...', 'title': 'Counter' }, 'path': '/mnt/b/Repositorios/reactful/experiments/routes/counter.tsx', 'name': 'default', 'type': 'meta'},{ 'call': '', 'data': { 'description': 'Hello forms...', 'title': 'Hello' }, 'path': '/mnt/b/Repositorios/reactful/experiments/routes/hello.tsx', 'name': 'default', 'type': 'meta'},{ 'call': () => React.createElement(React.Fragment, null, React.createElement('h1', null, 'Profile'), React.createElement(Detail, null), React.createElement('hr', null), React.createElement('p', null, 'modular CSS chainging to red')), 'data': '/profile/:id', 'path': '/mnt/b/Repositorios/reactful/experiments/routes/profile/index.tsx', 'name': '', 'type': 'href'},{ 'call': '', 'data': { 'description': 'Profile description', 'title': 'Profile' }, 'path': '/mnt/b/Repositorios/reactful/experiments/routes/profile/index.tsx', 'name': 'default', 'type': 'meta'},{ 'call': '', 'data': { 'description': 'Philosophy quotes...', 'title': 'Quotes' }, 'path': '/mnt/b/Repositorios/reactful/experiments/routes/quotes.tsx', 'name': 'Quotes', 'type': 'meta'},{ 'call': '', 'data': { 'charset': 'UTF-16', 'rating': 'general', 'keywords': 'hello, hi', 'title': 'System' }, 'path': '/mnt/b/Repositorios/reactful/experiments/routes/system.tsx', 'name': 'System', 'type': 'meta'},{ 'call': '', 'data': { 'title': 'About', 'description': 'About page' }, 'path': '/about', 'name': 'default', 'type': 'meta'},{ 'call': '', 'data': '%0A%20%20%20%3Ch1%3EAbout%3C/h1%3E%0A%20%20%20%3Cp%3E%0A%20%20%20Lorem%20ipsum%20dolor%20sit%20amet%20consectetur%20adipisicing%20elit.%20%0A%20%20%20Adipisci%20id%20eaque%20saepe%20ab%20numquam,%20nisi%20minus%20atque%20obcaecati,%20%0A%20%20%20dignissimos%20facere%20accusamus%20nihil%20ipsam%20repudiandae%20praesentium,%20%0A%20%20%20quia%20animi%20perspiciatis%20architecto%20fuga?%20%0A%20%20%20%3C/p%3E%20%20%20%20%0A', 'path': '/about', 'name': '', 'type': 'html'},{ 'call': '', 'data': '<h3>Loading content...</h3>', 'path': '/clock', 'name': 'default', 'type': 'lazy'},{ 'call': '', 'data': '<h3>Loading content...</h3>', 'path': '/clock', 'name': 'TimeZone', 'type': 'lazy'},{ 'call': '', 'data': '%3Ch1%20tag=%22h1%22%20uid=%226%22%20class=%22TimeZone%22%3EWorld%20Clock%3C/h1%3E%3Ch2%20tag=%22h2%22%20uid=%228%22%20class=%22TimeZone%22%3EEurope/Amistedan%20timezone%3C/h2%3E%3Ch3%20style=%22color:yellow%22%20tag=%22h3%22%20uid=%2210%22%20class=%22TimeZone%22%3E%20%3C!--%20--%3E2024-2-20%3C!--%20--%3E%20%3C!--%20--%3E17:11:50%3C!--%20--%3E%20%3C/h3%3E%3Ccode%20tag=%22code%22%20uid=%2215%22%20own=%22InnerAsyncComponent%22%20class=%22InnerAsyncComponent%22%3E%3Cmark%20tag=%22mark%22%20uid=%2217%22%20class=%22InnerAsyncComponent%22%3EI&#x27;m%20a%20inner%20subcomponent%20!!!%3C/mark%3E%3C/code%3E', 'path': '/clock', 'name': '', 'type': 'html'},{ 'call': '', 'data': '%3Ch1%20tag=%22h1%22%20uid=%223%22%20class=%22default%22%3ECounter%3C/h1%3E%3Cjsx%20tag=%22jsx%22%20uid=%229%22%20own=%22default%22%20src=%22/mnt/b/Repositorios/reactful/experiments/routes/counter.tsx%22%20hidden=%22%22%20class=%22default%22%3E%3Cbutton%20style=%22padding:20px%22%3ECOUNTED:%20%3Cb%3E0%3C/b%3E%3C/button%3E%3C/jsx%3E%3Ch6%20tag=%22h6%22%20uid=%227%22%20class=%22default%22%20hidden=%22%22%3EDONT%20SHOW%20ME!%3C/h6%3E', 'path': '/counter', 'name': '', 'type': 'html'},{ 'call': '', 'data': '%3Cjsx%20tag=%22jsx%22%20uid=%222%22%20own=%22default%22%20src=%22/mnt/b/Repositorios/reactful/experiments/routes/forms/form.tsx%22%20hidden=%22%22%20class=%22default%22%3E%3Ch1%3EUncontrolled%20Components%3C/h1%3E%3Cprogress%20hidden=%22%22%3Etest...%3C/progress%3E%3Cform%20cols=%222%22%20method=%22post%22%20action=%22https://jsonplaceholder.typicode.com/posts1%22%3E%3Clabel%3EName%3Cinput%20id=%22name%22%20bind=%22name%22/%3E%3C/label%3E%3Clabel%3EDate%3Cinput%20type=%22date%22%20bind=%22date%22/%3E%3C/label%3E%3Clabel%3EWork%3Cinput%20pattern=%22dev%7Ctest%22%20bind=%22work%22/%3E%3C/label%3E%3Clabel%3EMode%3Cinput%20bind=%22mode%22/%3E%3C/label%3E%3Chr/%3E%3Chr/%3E%3Clabel%3EAccept?%3Cinput%20bind=%22term%22%20type=%22checkbox%22%20required=%22%22/%3E%3C/label%3E%3Cbutton%3ESubmit%3C/button%3E%3C/form%3E%3Cfieldset%3E%3Clegend%3EERROR%3C/legend%3E%3Cul%3E%3C/ul%3E%3C/fieldset%3E%3C/jsx%3E', 'path': '/forms/form', 'name': '', 'type': 'html'},{ 'call': '', 'data': '%3Cjsx%20tag=%22jsx%22%20uid=%222%22%20own=%22default%22%20src=%22/mnt/b/Repositorios/reactful/experiments/routes/forms/form.tsx%22%20hidden=%22%22%20class=%22default%22%3E%3Ch1%3EUncontrolled%20Components%3C/h1%3E%3Cprogress%20hidden=%22%22%3Etest...%3C/progress%3E%3Cform%20cols=%222%22%20method=%22post%22%20action=%22https://jsonplaceholder.typicode.com/posts1%22%3E%3Clabel%3EName%3Cinput%20id=%22name%22%20bind=%22name%22/%3E%3C/label%3E%3Clabel%3EDate%3Cinput%20type=%22date%22%20bind=%22date%22/%3E%3C/label%3E%3Clabel%3EWork%3Cinput%20pattern=%22dev%7Ctest%22%20bind=%22work%22/%3E%3C/label%3E%3Clabel%3EMode%3Cinput%20bind=%22mode%22/%3E%3C/label%3E%3Chr/%3E%3Chr/%3E%3Clabel%3EAccept?%3Cinput%20bind=%22term%22%20type=%22checkbox%22%20required=%22%22/%3E%3C/label%3E%3Cbutton%3ESubmit%3C/button%3E%3C/form%3E%3Cfieldset%3E%3Clegend%3EERROR%3C/legend%3E%3Cul%3E%3C/ul%3E%3C/fieldset%3E%3C/jsx%3E', 'path': '/forms/index', 'name': '', 'type': 'html'},{ 'call': '', 'data': '%3Cjsx%20tag=%22jsx%22%20uid=%222%22%20own=%22default%22%20src=%22/mnt/b/Repositorios/reactful/experiments/routes/hello.tsx%22%20hidden=%22%22%20class=%22default%22%3E%3Ch1%20style=%22color:wheat%22%3EHello%20Forms%3C/h1%3E%3Cmain%20gaps=%220%2010px%22%20cols=%221%22%3E%3Clabel%3E%3Cb%3ELOCAL%20state%20%3C/b%3E%20%3Ccode%3Efunction(props)%3C/code%3E%3Cbr/%3E%3Cinput%20id=%221%22%20data=%22%5Bobject%20Object%5D%22%20bind=%22value%22%20placeholder=%22%7Bprops%7D%22/%3E%3Cinput%20id=%221.1%22%20bind=%22value%22%20placeholder=%22default%22/%3E%3Cinput%20id=%221.1.1%22%20placeholder=%22inner%22%20data=%22%5Bobject%20Object%5D%22%20bind=%22value%22/%3E%3Clabel%3E%20=%20%3C/label%3E%3C/label%3E%3Clabel%3E%3Cb%3EGLOBAL%20state%3C/b%3E%20%3Ccode%3Efunction(props,%20%3C!--%20--%3E%7B%20store%20%7D%3C!--%20--%3E)%3C/code%3E%3Cbr/%3E%3Cinput%20id=%222%22%20data=%22%5Bobject%20Object%5D%22%20bind=%22value%22%20placeholder=%22outer%22/%3E%3Cinput%20id=%222.1%22%20placeholder=%22inner%22%20bind=%22value%22/%3E%3C/label%3E%3Clabel%3E%3Cb%3EORBITAL%20state%3C/b%3E%20%3Ccode%3EuseStore(...)%20+%20@state(...)%20%3C/code%3E%3Cbr/%3E%3Cinput%20id=%223%22%20data=%22%5Bobject%20Object%5D%22%20bind=%22value%22%20placeholder=%22outer%22/%3E%3Cinput%20id=%223.1%22%20placeholder=%22inner%22%20data=%22%5Bobject%20Object%5D%22%20bind=%22value%22/%3E%3Cinput%20id=%223.2%22%20data=%22%5Bobject%20Object%5D%22%20bind=%22value%22%20placeholder=%22other%22/%3E%20=%20%3C!--%20--%3E1%3C/label%3E%3C/main%3E%3Cbr/%3E%3Chr/%3E%3Ccode%3E%3Cstrong%3Elocal%3C/strong%3E:%20%3Clabel%20id=%22l1%22%3E%3C/label%3E%3Cbr/%3E%3Cstrong%3Eglobal%3C/strong%3E:%20%3Clabel%20id=%22l2%22%3E%3C/label%3E%3Cbr/%3E%3Cstrong%3Eorbital%3C/strong%3E:%20%3Clabel%20id=%22l3%22%3E0%3C/label%3E%3C/code%3E%3C/jsx%3E', 'path': '/hello', 'name': '', 'type': 'html'},{ 'call': '', 'data': { 'title': 'Sample', 'description': 'Sample page' }, 'path': '/htmlx', 'name': 'default', 'type': 'meta'},{ 'call': '', 'data': '%3Ch1%20style=%22color:wheat%22%3EHTML-X%3C/h1%3E%3Cp%3ELorem%20ipsum%20dolor%20sit%20amet%20consectetur%20adipisicing%20elit.%20Similique%20eum%20quaerat%20nesciunt%20est%20molestias%20accusantium%20aut%20sit%20odit,%20vero%20voluptate%20iure%20vel%20aperiam%20modi%20libero%20in%20praesentium%20nam%20obcaecati%20error!%3C/p%3E', 'path': '/htmlx', 'name': '', 'type': 'html'},{ 'call': '', 'data': '%3Ch1%3EWelcome%3C/h1%3E%0A%3Cblockquote%3E%0A%3Cp%3Ewith%20markdown%20(powered%20by%20marked)%3C/p%3E%0A%3C/blockquote%3E%0A%3Ctable%3E%0A%3Cthead%3E%0A%3Ctr%3E%0A%3Cth%20align=%22right%22%3E%3C/th%3E%0A%3Cth%3E%3C/th%3E%0A%3C/tr%3E%0A%3C/thead%3E%0A%3Ctbody%3E%3Ctr%3E%0A%3Ctd%20align=%22right%22%3E%3Ca%20href=%22/about%22%3EAbout%3C/a%3E%3C/td%3E%0A%3Ctd%3EStatic%20generation%20(default)%3C/td%3E%0A%3C/tr%3E%0A%3Ctr%3E%0A%3Ctd%20align=%22right%22%3E%3Ca%20href=%22/clock%22%3EClock%3C/a%3E%3C/td%3E%0A%3Ctd%3EDynamic%20generation%20(with%20lazy)%3C/td%3E%0A%3C/tr%3E%0A%3Ctr%3E%0A%3Ctd%20align=%22right%22%3E%3Ca%20href=%22/htmlx%22%3EHTML-X%3C/a%3E%3C/td%3E%0A%3Ctd%3EHTML%20with%20JSX%20using%20link%5Btype=%22component%22%5D%3C/td%3E%0A%3C/tr%3E%0A%3Ctr%3E%0A%3Ctd%20align=%22right%22%3E%3Ca%20href=%22/system%22%3ESystem%3C/a%3E%3C/td%3E%0A%3Ctd%3EServer%20component%3C/td%3E%0A%3C/tr%3E%0A%3Ctr%3E%0A%3Ctd%20align=%22right%22%3E%3Ca%20href=%22/quotes%22%3EQuotes%3C/a%3E%3C/td%3E%0A%3Ctd%3EPeriodic%20genreation%3C/td%3E%0A%3C/tr%3E%0A%3Ctr%3E%0A%3Ctd%20align=%22right%22%3E%3Ca%20href=%22/counter%22%3ECounter%3C/a%3E%3C/td%3E%0A%3Ctd%3EClient%20component%3C/td%3E%0A%3C/tr%3E%0A%3Ctr%3E%0A%3Ctd%20align=%22right%22%3E%3Ca%20href=%22/hello%22%3EHello%3C/a%3E%3C/td%3E%0A%3Ctd%3EStateful%20object%20+%20data%20bind%20props%3C/td%3E%0A%3C/tr%3E%0A%3Ctr%3E%0A%3Ctd%20align=%22right%22%3E%3Ca%20href=%22/forms%22%3EForms%3C/a%3E%3C/td%3E%0A%3Ctd%3Ereactful%20forms%20+%20validation%20API%20+%20server%20action%3C/td%3E%0A%3C/tr%3E%0A%3Ctr%3E%0A%3Ctd%20align=%22right%22%3E%3Ca%20href=%22/login%22%3ELogin%3C/a%3E%3C/td%3E%0A%3Ctd%3Ereactful%20forms%20server%20action%20authentication%3C/td%3E%0A%3C/tr%3E%0A%3Ctr%3E%0A%3Ctd%20align=%22right%22%3E%3Ca%20href=%22/profile/123%22%3EProfile%3C/a%3E%3C/td%3E%0A%3Ctd%3EParametric%20(dynamic)%20routes%20with%20modular%20CSS%3C/td%3E%0A%3C/tr%3E%0A%3C/tbody%3E%3C/table%3E%0A', 'path': '/index', 'name': '', 'type': 'html'},{ 'call': '', 'data': '%3Cjsx%20tag=%22jsx%22%20uid=%222%22%20own=%22default%22%20src=%22/mnt/b/Repositorios/reactful/experiments/routes/login.tsx%22%20hidden=%22%22%20class=%22default%22%3E%3Ch1%3ELogin%3C/h1%3E%3Cprogress%20hidden=%22%22%3Eloading...%3C/progress%3E%3Cform%20method=%22POST%22%20action=%22http://localhost:3000/api/auth%22%20bearer=%22access_token%22%3E%3Csection%20cols=%221%22%3E%3Clabel%3EUserName%3Cinput%20bind=%22username%22/%3E%3C/label%3E%3Clabel%3EPassWord%3Cinput%20type=%22password%22%20bind=%22password%22/%3E%3C/label%3E%3C/section%3E%3Cbutton%3ESubmit%3C/button%3E%3C/form%3E%3Cfieldset%3E%3Clegend%3EERROR%3C/legend%3E%3Cul%3E%3C/ul%3E%3C/fieldset%3E%3Cbr/%3E%3Cfieldset%20style=%22word-break:break-all%22%3E%3Clegend%3Etoken%3C/legend%3E%3C/fieldset%3E%3C/jsx%3E', 'path': '/login', 'name': '', 'type': 'html'},{ 'call': '', 'data': '%3Ch1%20tag=%22h1%22%20uid=%223%22%20class=%22default%22%20style=%22color:#ffb300%22%3EProfile%3C/h1%3E%3Cjsx%20tag=%22jsx%22%20uid=%2212%22%20own=%22default%22%20src=%22/mnt/b/Repositorios/reactful/experiments/routes/profile/detail.tsx%22%20hidden=%22%22%20class=%22default%22%3E%3Ch3%3EDetail%3C/h3%3EParametric%20value%20=%20%3Cb%3E%3C/b%3E%3Chr/%3E%3Cp%3Emodular%20CSS%20keep%20original%20color%3C/p%3E%3Cfieldset%3E%3Clegend%3EMode%3C/legend%3E%3Csection%3E%3Cbutton%20link=%22./developer%22%3Edeveloper%3C/button%3E%3Cbutton%20link=%22./manager%22%3Emanager%3C/button%3E%3Cbutton%20link=%22./tester%22%3Etester(component)%3C/button%3E%3C/section%3E%3Chr/%3E%3Csection%20route=%22./developer%22%3E%3Cb%3EDEVELOPER%3C/b%3E%20is%20Lorem%20ipsum%20dolor%20sit%20amet%20consectetur%20adipisicing%20elit.%20Aspernatur%20similique%20ipsa,%20molestiae%20numquam%20laudantium%20quod,%20aliquid%20soluta%20cumque%20placeat%20saepe%20mollitia%20sint%20consectetur%20labore%20consequatur%20pariatur%20praesentium%20animi.%20Obcaecati,%20nihil?%3C/section%3E%3Csection%20route=%22./manager%22%3E%3Cb%3EMANAGER%3C/b%3E%20is%20Lorem%20ipsum%20dolor%20sit%20amet%20consectetur%20adipisicing%20elit.%20Aspernatur%20similique%20ipsa,%20molestiae%20numquam%20laudantium%20quod,%20aliquid%20soluta%20cumque%20placeat%20saepe%20mollitia%20sint%20consectetur%20labore%20consequatur%20pariatur%20praesentium%20animi.%20Obcaecati,%20nihil?%3C/section%3E%3Cdiv%3E%3C/div%3E%3C/fieldset%3E%3C/jsx%3E%3Chr%20tag=%22hr%22%20uid=%228%22%20class=%22default%22/%3E%3Cp%20tag=%22p%22%20uid=%2210%22%20class=%22default%22%20style=%22color:red%22%3Emodular%20CSS%20chainging%20to%20red%3C/p%3E', 'path': '/profile/index', 'name': '', 'type': 'html'},{ 'call': '', 'data': '%3Ch1%20tag=%22h1%22%20uid=%223%22%20class=%22System%22%3EServer%20OS%3C/h1%3E%3Ch2%20tag=%22h2%22%20uid=%225%22%20class=%22System%22%3Eserver%20side%20information%3C/h2%3E%3Cpre%20tag=%22pre%22%20uid=%227%22%20class=%22System%22%3ELinux%3C!--%20--%3E%20%7C%20%3C!--%20--%3Ex64%3C!--%20--%3E%20%7C%20%3C!--%20--%3E5.15.133.1-microsoft-standard-WSL2%3C!--%20--%3E%20%3C/pre%3E%3Csection%20tag=%22section%22%20uid=%229%22%20class=%22System%22%20hidden=%22%22%3EDONT%20SHOW%20ME!%3C/section%3E', 'path': '/system', 'name': '', 'type': 'html'}];
64
- globalThis[GLOBAL_KEY].context={
65
- "fails": [],
66
- "store": {
67
- "name": "ok"
68
- },
69
- "param": {},
70
- "await": "",
71
- "logon": ""
72
- };
73
- globalThis[GLOBAL_KEY].propers=[(props) => props?.shown === !1 ? { ...props, hidden: !0 } : props];
74
- globalThis[GLOBAL_KEY].stylers={"/mnt/b/Repositorios/reactful/experiments/routes/forms/form.tsx":["/* form {\r\n gap: 20px;\r\n display: grid;\r\n grid-template-columns: repeat(2, 1fr);\r\n} */\r\n\r\ncode {\r\n padding: 10px;\r\n display: block;\r\n background: silver;\r\n}\r\n\r\nprogress { \r\n width: 100%;\r\n height: 30px; \r\n}\r\n\r\nprogress[value]::-webkit-progress-bar { border-radius: 0; }\r\nprogress[value]::-webkit-progress-value { border-radius: 0; }"],"/mnt/b/Repositorios/reactful/experiments/routes/profile/detail.tsx":["h1 {\n color: dimgrey;\n font-size: 1.7rem;\n}\n\nbutton {\n padding: 10px 20px;\n}\n\nbutton.routed {\n background: wheat;\n font-weight: bolder;\n}"],"/mnt/b/Repositorios/reactful/experiments/routes/profile/index.tsx":["h1 {\n color: #ffb300;\n}\n\np {\n color:red;\n}\n\n"]};
75
- globalThis[GLOBAL_KEY].folders={"apis":"/apis","assets":"/assets","builds":"/builds","routes":"/routes","shares":"/shares","directives":"/directives","components":"/components"};
76
- globalThis[GLOBAL_KEY].binding={"index":0,"count":0,"state":{},"react":{},"visit":[],"ready":false,"store":{"state":{"1":{"value":0},"2":{"value":1}},"count":2,"react":{"1":[null],"2":[null]}}};
@@ -1,27 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <meta name="description" content="Home page">
7
- <meta name="theme-color" content="#333">
8
- <link rel="stylesheet" href="/assets/markdown.css">
9
- <link rel="stylesheet" href="/assets/default.css">
10
- <link rel="manifest" href="/assets/manifest.json">
11
- <title>Welcome</title>
12
- <meta name='viewport' content='width=device-width, initial-scale=1.0' />
13
- <meta name='description' content='Home page' />
14
- <meta name='theme-color' content='#333' />
15
- <meta name='title' content='Welcome' />
16
- <script src='/mnt/b/Repositorios/reactful/experiments/builds/shared.js'></script>
17
- <script type='module' src='/mnt/b/Repositorios/reactful/experiments/builds/bundle.js'></script></head>
18
- <body>
19
- <div id='root'>
20
- <h1 tag="h1" uid="3" class="System">Server OS</h1>
21
- <h2 tag="h2" uid="5" class="System">server side information</h2>
22
- <pre tag="pre" uid="7"
23
- class="System">Linux<!-- --> | <!-- -->x64<!-- --> | <!-- -->5.15.133.1-microsoft-standard-WSL2<!-- --> </pre>
24
- <section tag="section" uid="9" class="System" hidden>DONT SHOW ME!</section>
25
- </div>
26
- </body>
27
- </html>
@@ -1,7 +0,0 @@
1
- import React from 'react'
2
-
3
- export const Header = props => <>
4
- <h1 style={{color:'wheat'}}>{ props.children || props.title }</h1>
5
- </>
6
-
7
- export default { ok:true }
@@ -1 +0,0 @@
1
- export * from './shown'
@@ -1,6 +0,0 @@
1
- declare module "react" { interface HTMLAttributes<T> { shown?:boolean } }
2
-
3
- export const shown = props =>
4
- props?.shown === false
5
- ? { ...props, hidden: true }
6
- : props
@@ -1,20 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
-
4
- <head>
5
- <meta charset="UTF-8">
6
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
-
8
- <meta name="description" content="Home page" >
9
- <meta name="theme-color" content="#333"/>
10
-
11
- <link rel="stylesheet" href="/assets/markdown.css">
12
- <link rel="stylesheet" href="/assets/default.css" />
13
- <link rel="manifest" href="/assets/manifest.json" />
14
-
15
- <title>Welcome</title>
16
- </head>
17
- <body>
18
- <div id="root"></div>
19
- </body>
20
- </html>
@@ -1,19 +0,0 @@
1
- import React from "react"
2
- import { shown } from './directives'
3
- import { server } from "@reactful/server"
4
-
5
- const storage = { name: "ok" }
6
-
7
- await server("/routes", { failure, storage })
8
- .inject(shown)
9
- .render("#root")
10
-
11
- function failure(status, errors) {
12
- const children: any[] = errors.map((x, i) =>
13
- React.createElement('li', { key:i }, x))
14
-
15
- return React.createElement('div', {}, [
16
- React.createElement('h1', {}, status),
17
- React.createElement('ul', {}, children),
18
- ])
19
- }
@@ -1,13 +0,0 @@
1
- <head>
2
- <title>About</title>
3
- <meta name="description" content="About page">
4
- </head>
5
- <body>
6
- <h1>About</h1>
7
- <p>
8
- Lorem ipsum dolor sit amet consectetur adipisicing elit.
9
- Adipisci id eaque saepe ab numquam, nisi minus atque obcaecati,
10
- dignissimos facere accusamus nihil ipsam repudiandae praesentium,
11
- quia animi perspiciatis architecto fuga?
12
- </p>
13
- </body>
@@ -1,35 +0,0 @@
1
- import React, { Suspense } from 'react'
2
- import { server, seo } from '@reactful/web'
3
-
4
- const loading = <h3>Loading content...</h3>
5
- const address = "https://timeapi.io/api/Time/current/zone?timeZone=Europe/Amsterdam"
6
-
7
- //@ts-ignore
8
- @server("dynamic")
9
- @seo('Time Zone', 'Time zone clock...')
10
- export default function(props: any) {
11
- return <Suspense fallback={loading}>
12
- <TimeZone />
13
- </Suspense>
14
- }
15
-
16
- async function TimeZone() {
17
- const response = await fetch(address)
18
- const { year, month, day, hour, minute, seconds } = await response.json()
19
- const time = `${hour}:${minute}:${seconds}`
20
- const date = `${year}-${month}-${day}`
21
-
22
- return <React.Fragment>
23
- <h1>World Clock</h1>
24
- <h2>Europe/Amistedan timezone</h2>
25
- <h3 style={{color:'yellow'}}> {date} {time} </h3>
26
- <Suspense fallback={loading}>
27
- <InnerAsyncComponent />
28
- </Suspense>
29
- </React.Fragment>
30
- }
31
-
32
- async function InnerAsyncComponent() {
33
- await new Promise(promise => setTimeout(promise, 1000))
34
- return <code><mark>I'm a inner subcomponent !!!</mark></code>
35
- }
@@ -1,21 +0,0 @@
1
- import React from 'react'
2
- import { seo, client } from '@reactful/web'
3
-
4
- //@ts-ignore
5
- @seo('Counter', '...')
6
- export default (props: any) => <>
7
- <h1>Counter</h1>
8
- <CountButton />
9
-
10
- <h6 shown={false}>DONT SHOW ME!</h6>
11
- </>
12
-
13
- //@ts-ignore
14
- @client(true)
15
- export function CountButton(props: any, feeds: any) {
16
- function onClick() { props.count ||= 0; props.count++ }
17
-
18
- return <button style={{ padding:'20px' }} onClick={onClick}>
19
- COUNTED: <b>{ props.count || 0 }</b>
20
- </button>
21
- }
@@ -1,19 +0,0 @@
1
- /* form {
2
- gap: 20px;
3
- display: grid;
4
- grid-template-columns: repeat(2, 1fr);
5
- } */
6
-
7
- code {
8
- padding: 10px;
9
- display: block;
10
- background: silver;
11
- }
12
-
13
- progress {
14
- width: 100%;
15
- height: 30px;
16
- }
17
-
18
- progress[value]::-webkit-progress-bar { border-radius: 0; }
19
- progress[value]::-webkit-progress-value { border-radius: 0; }
@@ -1,51 +0,0 @@
1
- import React from "react"
2
- import { client } from "@reactful/web"
3
- import '@reactful/commons'
4
- import "./form.css"
5
-
6
- //@ts-ignore
7
- @client(true)
8
- export default (props, { fails: errors, await: awaits }: Feeds ) => <>
9
- <h1>Uncontrolled Components</h1>
10
- <progress hidden={!awaits} >test...</progress>
11
-
12
- <form grid cols={2} method="post" data={props.user}
13
- action="https://jsonplaceholder.typicode.com/posts1"
14
- onValidate={onValidate} onSubmit={e => onSubmit(e)}>
15
-
16
- <label>Name<input id="name" bind="name" /></label>
17
- <label>Date<input type="date" bind="date" /></label>
18
- <label>Work<input pattern="dev|test" bind="work" /></label>
19
- <label>Mode<input validate={modeValidate} bind="mode" /></label>
20
-
21
- <hr/><hr/>
22
- <label>Accept?<input bind="term" type="checkbox" required /></label>
23
- <button>Submit</button>
24
- </form>
25
-
26
-
27
- <fieldset shown={!!errors?.length}>
28
- <legend>ERROR</legend>
29
- <ul>{ errors?.map(x => <li>{ x.error }</li>) }</ul>
30
- </fieldset>
31
- </>
32
-
33
- function modeValidate(value: string) {
34
- console.log('modeValidate', value)
35
- if (!value) return 'Mode is required!'
36
- if (value.match(/\d+/)) return 'Mode is non-numerical!'
37
- return ''
38
- }
39
-
40
- function onSubmit(e) {
41
- // after submited validation (feeds)
42
- console.log('after form submit', e)
43
-
44
- }
45
-
46
- async function onValidate(errors: Invalid[]) {
47
- // add some async custom invalidations
48
- // ex.: errors.push({field:'*', error:'some error', value:''})
49
-
50
- console.warn(errors)
51
- }
@@ -1,3 +0,0 @@
1
- import Form from './form'
2
-
3
- export default Form
@@ -1,62 +0,0 @@
1
- import React from 'react'
2
- import { seo, client, useStore, state } from '@reactful/web'
3
- import { Header } from '../components/header'
4
-
5
- const orbital1 = useStore({ value:0 })
6
- const orbital2 = useStore({ value:1 })
7
-
8
- //@ts-ignore
9
- @client(true)
10
- @state(orbital1)
11
- @state(orbital2)
12
- @seo('Hello', 'Hello forms...')
13
- export default function Hello(props, { store }: Feeds) {
14
- if (globalThis.document) globalThis.props = props
15
-
16
- return <>
17
- <Header>Hello Forms</Header>
18
- <main grid gaps='0 10px' cols={1}>
19
- <label>
20
- <b>LOCAL state </b> <code>function(props)</code><br/>
21
- <input id='1' data={props} bind="value" placeholder="{props}" />
22
- <input id='1.1' bind="value" placeholder="default" />
23
- <SubLocal id='1.1.1' placeholder="inner" />
24
- </label>
25
-
26
- <label>
27
- <b>GLOBAL state</b> <code>function(props, {'{ store }'})</code><br/>
28
- <input id='2' data={store} bind="value" placeholder="outer" />
29
- <SubGlobal id='2.1' placeholder='inner' />
30
- </label>
31
-
32
- <label>
33
- <b>ORBITAL state</b> <code>useStore(...) + @state(...)</code><br/>
34
- <input id='3' data={orbital1} bind="value" placeholder="outer" />
35
- <SubOrbital id='3.1' placeholder='inner' />
36
- <input id='3.2' data={orbital2} bind="value" placeholder="other" /> = {orbital2.value }
37
- </label>
38
- </main>
39
- <br />
40
- <hr />
41
- <code>
42
- <strong>local</strong>: <label id='l1'>{ props.value }</label><br />
43
- <strong>global</strong>: <label id='l2'>{ store.value }</label><br />
44
- <strong>orbital</strong>: <label id='l3'>{ orbital1.value }</label>
45
- </code>
46
- </>
47
- }
48
-
49
-
50
- function SubGlobal(props, { store }) {
51
- return <input {...props} data={store} bind='value' />
52
- }
53
-
54
- function SubLocal(props) {
55
- return <><input {...props} data={props} bind='value' /><label> = {props.value}</label></>
56
- }
57
-
58
- //@ts-ignore
59
- @state(orbital1)
60
- function SubOrbital(props) {
61
- return <input {...props} data={orbital1} bind='value' />
62
- }
@@ -1,15 +0,0 @@
1
- <head>
2
- <title>Sample</title>
3
- <meta name="description" content="Sample page">
4
- <link type="component" href="../components/header.tsx" rel="Header" />
5
- </head>
6
- <body>
7
- <!-- no {interpolation} -->
8
- <Header title="HTML-X" />
9
- <p>
10
- Lorem ipsum dolor sit amet consectetur adipisicing elit.
11
- Similique eum quaerat nesciunt est molestias accusantium
12
- aut sit odit, vero voluptate iure vel aperiam modi libero
13
- in praesentium nam obcaecati error!
14
- </p>
15
- </body>
@@ -1,15 +0,0 @@
1
- # Welcome
2
- > with markdown (powered by marked)
3
-
4
- | | |
5
- | ----------------------: | ----------------------------------------------- |
6
- | [About](/about) | Static generation (default) |
7
- | [Clock](/clock) | Dynamic generation (with lazy) |
8
- | [HTML-X](/htmlx) | HTML with JSX using link[type='component'] |
9
- | [System](/system) | Server component |
10
- | [Quotes](/quotes) | Periodic genreation |
11
- | [Counter](/counter) | Client component |
12
- | [Hello](/hello) | Stateful object + data bind props |
13
- | [Forms](/forms) | reactful forms + validation API + server action |
14
- | [Login](/login) | reactful forms server action authentication |
15
- | [Profile](/profile/123) | Parametric (dynamic) routes with modular CSS |
@@ -1,36 +0,0 @@
1
- // @ts-ignore: 1206
2
-
3
- import React from 'react'
4
- import { client } from '@reactful/web'
5
-
6
- //@ts-ignore
7
- @client(true)
8
- export default (props, feeds: Feeds) => <>
9
- <h1>Login</h1>
10
-
11
- <progress hidden={!feeds.await}>loading...</progress>
12
-
13
- <form method="POST" data={props.user}
14
- action="http://localhost:3000/api/auth"
15
- bearer="access_token">
16
-
17
- <section grid cols={1}>
18
- <label>UserName<input bind="username" /></label>
19
- <label>PassWord<input type="password" bind="password" /></label>
20
- </section>
21
-
22
- <button>Submit</button>
23
- </form>
24
-
25
- <fieldset shown={!!feeds.fails?.length}>
26
- <legend>ERROR</legend>
27
- <ul>{ feeds.fails?.map((x,i) => <li key={i}>{ x.error }</li>) }</ul>
28
- </fieldset>
29
-
30
- <br />
31
-
32
- <fieldset style={{ wordBreak: 'break-all' }}>
33
- <legend>token</legend>
34
- { sessionStorage.getItem("token") }
35
- </fieldset>
36
- </>
@@ -1,13 +0,0 @@
1
- h1 {
2
- color: dimgrey;
3
- font-size: 1.7rem;
4
- }
5
-
6
- button {
7
- padding: 10px 20px;
8
- }
9
-
10
- button.routed {
11
- background: wheat;
12
- font-weight: bolder;
13
- }
@@ -1,48 +0,0 @@
1
- import React from 'react'
2
- import { client } from '@reactful/web'
3
- import '@reactful/extensions'
4
- import './detail.css'
5
-
6
- const Tester = import('./tester').asLazyComponent("Tester")
7
-
8
- //@ts-ignore
9
- @client(true)
10
- export function Detail(_, feeds: Feeds) {
11
- return <>
12
- <h3>Detail</h3>
13
- Parametric value = <b>{ feeds.param.id }</b>
14
-
15
- <hr />
16
- <p>modular CSS keep original color</p>
17
-
18
- <fieldset>
19
- <legend>Mode</legend>
20
-
21
- <section>
22
- <button link='./developer'>developer</button>
23
- <button link='./manager'>manager</button>
24
- <button link='./tester'>tester (component)</button>
25
- </section>
26
-
27
- <hr/>
28
-
29
- <section route='./developer'>
30
- <b>DEVELOPER</b> is Lorem ipsum dolor sit amet consectetur
31
- adipisicing elit. Aspernatur similique ipsa, molestiae
32
- numquam laudantium quod, aliquid soluta cumque placeat
33
- saepe mollitia sint consectetur labore consequatur
34
- pariatur praesentium animi. Obcaecati, nihil?
35
- </section>
36
-
37
- <section route='./manager'>
38
- <b>MANAGER</b> is Lorem ipsum dolor sit amet consectetur
39
- adipisicing elit. Aspernatur similique ipsa, molestiae
40
- numquam laudantium quod, aliquid soluta cumque placeat
41
- saepe mollitia sint consectetur labore consequatur
42
- pariatur praesentium animi. Obcaecati, nihil?
43
- </section>
44
-
45
- <Tester route='./tester' />
46
- </fieldset>
47
- </>
48
- }
@@ -1,14 +0,0 @@
1
- import React from 'react'
2
- import { Detail } from './detail'
3
- import { seo, route } from '@reactful/web'
4
- import './profile.css'
5
-
6
- //@ts-ignore
7
- @route("/profile/:id")
8
- @seo('Profile', 'Profile description')
9
- export default () => <>
10
- <h1>Profile</h1>
11
- <Detail />
12
- <hr/>
13
- <p>modular CSS chainging to red</p>
14
- </>
@@ -1,8 +0,0 @@
1
- h1 {
2
- color: #ffb300;
3
- }
4
-
5
- p {
6
- color:red;
7
- }
8
-
@@ -1,11 +0,0 @@
1
- import React from "react"
2
-
3
- export function Tester() {
4
- return <section route='./manager'>
5
- <b>TESTER</b> is Lorem ipsum dolor sit amet consectetur
6
- adipisicing elit. Aspernatur similique ipsa, molestiae
7
- numquam laudantium quod, aliquid soluta cumque placeat
8
- saepe mollitia sint consectetur labore consequatur
9
- pariatur praesentium animi. Obcaecati, nihil?
10
- </section>
11
- }
@@ -1,25 +0,0 @@
1
- import React from 'react'
2
- import { seo, server, error } from '@reactful/web'
3
-
4
- //@ts-ignore
5
- @server("periodic", "30min")
6
- @error(specificErrorComponent)
7
- @seo('Quotes', 'Philosophy quotes...')
8
- export default async function Quotes(props: any) {
9
- const url = "http://localhost:3000/api/quotes"
10
- const txt = await fetch(url).then(x => x.text())
11
-
12
- return <>
13
- <h1>Philosophy quote of the day</h1>
14
- <blockquote style={{zoom:1.1}}>{txt}</blockquote>
15
- <hr /><code>it will be regenerated in each 30min (press F5 to check)</code>
16
- </>
17
- }
18
-
19
- function specificErrorComponent(status: number, errors: string[]) {
20
- return <>
21
- <h1>My custom error component</h1>
22
- <p> { errors.join(', ') } </p><hr/>
23
- <code>it will be regenerated in each 30min (press F5 to check)</code>
24
- </>
25
- }