@reactful/create 1.2.1 → 1.2.3

package/templates/sampling/builds/shared.js

@@ -1,76 +1,77 @@
-
-      const GLOBAL_KEY = Symbol.for('settings')
-      const process = { env: {
-   "NODE_ENV": "development",
-   "SHELL": "/usr/bin/zsh",
-   "LSCOLORS": "Gxfxcxdxbxegedabagacad",
-   "USER_ZDOTDIR": "/root",
-   "COLORTERM": "truecolor",
-   "LESS": "-R",
-   "NVM_INC": "/root/.nvm/versions/node/v21.5.0/include/node",
-   "WSL2_GUI_APPS_ENABLED": "1",
-   "TERM_PROGRAM_VERSION": "1.86.2",
-   "WSL_DISTRO_NAME": "Debian",
-   "NODE": "/root/.nvm/versions/node/v21.5.0/bin/node",
-   "npm_config_local_prefix": "/mnt/b/Repositorios/reactful/",
-   "NAME": "JSR-DESKTOP",
-   "PWD": "/mnt/b/Repositorios/reactful",
-   "LOGNAME": "root",
-   "PORT": "3333",
-   "_": "/root/.bun/bin/bun",
-   "VSCODE_GIT_ASKPASS_NODE": "/root/.vscode-server/bin/903b1e9d8990623e3d7da1df3d33db3e42d80eda/node",
-   "VSCODE_INJECTION": "1",
-   "HOME": "/root",
-   "LANG": "en_US.UTF-8",
-   "WSL_INTEROP": "/run/WSL/286_interop",
-   "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:",
-   "WAYLAND_DISPLAY": "wayland-0",
-   "GIT_ASKPASS": "/root/.vscode-server/bin/903b1e9d8990623e3d7da1df3d33db3e42d80eda/extensions/git/dist/askpass.sh",
-   "NVM_DIR": "/root/.nvm",
-   "VSCODE_GIT_ASKPASS_EXTRA_ARGS": "",
-   "TERM": "xterm-256color",
-   "npm_package_name": "reactful",
-   "ZSH": "/root/.oh-my-zsh",
-   "ZDOTDIR": "/root",
-   "USER": "root",
-   "VSCODE_GIT_IPC_HANDLE": "/run/user/0/vscode-git-7034020a55.sock",
-   "DISPLAY": ":0",
-   "npm_lifecycle_event": "start",
-   "SHLVL": "1",
-   "NVM_CD_FLAGS": "-q",
-   "PAGER": "less",
-   "npm_config_user_agent": "bun/1.0.25 npm/? node/v21.6.0 linux x64",
-   "npm_execpath": "/root/.bun/bin/bun",
-   "XDG_RUNTIME_DIR": "/run/user/0/",
-   "MINIFY": "false",
-   "WSLENV": "VSCODE_WSL_EXT_LOCATION/up",
-   "npm_package_json": "/mnt/b/Repositorios/reactful/package.json",
-   "BUN_INSTALL": "/root/.bun",
-   "VSCODE_GIT_ASKPASS_MAIN": "/root/.vscode-server/bin/903b1e9d8990623e3d7da1df3d33db3e42d80eda/extensions/git/dist/askpass-main.js",
-   "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",
-   "DBUS_SESSION_BUS_ADDRESS": "unix:path=/run/user/0/bus",
-   "NVM_BIN": "/root/.nvm/versions/node/v21.5.0/bin",
-   "HOSTTYPE": "x86_64",
-   "PULSE_SERVER": "unix:/mnt/wslg/PulseServer",
-   "npm_node_execpath": "/root/.nvm/versions/node/v21.5.0/bin/node",
-   "OLDPWD": "/mnt/b/Repositorios/reactful",
-   "TERM_PROGRAM": "vscode",
-   "VSCODE_IPC_HOOK_CLI": "/run/user/0/vscode-ipc-207d1c71-becd-47bb-ae4a-05d160937103.sock"
-} }
-
-      globalThis[GLOBAL_KEY] ||= { queryId:'#root' }
-      globalThis[GLOBAL_KEY].renders=[{   'path': '/mnt/b/Repositorios/reactful/experiment/routes/clock.tsx',   'name': 'default$',   'time': '',   'mode': 'dynamic',   'href': '/mnt/b/Repositorios/reactful/experiment/routes/clock.tsx'},{   'path': '/mnt/b/Repositorios/reactful/experiment/routes/quotes.tsx',   'name': 'Quotes',   'time': 1800000,   'mode': 'periodic',   'href': '/mnt/b/Repositorios/reactful/experiment/routes/quotes.tsx'}];
-      globalThis[GLOBAL_KEY].caching=[{   'call': '',   'data': {      'description': 'Time zone clock...',      'title': 'Time Zone'   },   'path': '/mnt/b/Repositorios/reactful/experiment/routes/clock.tsx',   'name': 'default$',   'type': 'meta'},{   'call': '',   'data': {      'description': '...',      'title': 'Counter'   },   'path': '/mnt/b/Repositorios/reactful/experiment/routes/counter.tsx',   'name': 'default',   'type': 'meta'},{   'call': '',   'data': {      'description': 'Hello forms...',      'title': 'Hello'   },   'path': '/mnt/b/Repositorios/reactful/experiment/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/experiment/routes/profile/index.tsx',   'name': '',   'type': 'href'},{   'call': '',   'data': {      'description': 'Profile description',      'title': 'Profile'   },   'path': '/mnt/b/Repositorios/reactful/experiment/routes/profile/index.tsx',   'name': 'default',   'type': 'meta'},{   'call': '',   'data': {      'description': 'Philosophy quotes...',      'title': 'Quotes'   },   'path': '/mnt/b/Repositorios/reactful/experiment/routes/quotes.tsx',   'name': 'Quotes',   'type': 'meta'},{   'call': '',   'data': {      'charset': 'UTF-16',      'rating': 'general',      'keywords': 'hello, hi',      'title': 'System'   },   'path': '/mnt/b/Repositorios/reactful/experiment/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': '%3Cdiv%20tag=%22TimeZone%22%20uid=%223%22%20own=%22default$%22%20fallback=%22%5Bobject%20Object%5D%22%20class=%22default%22%20retry=%22/clock%22%20hidden=%22%22%3E%3Ch1%3E500%3C/h1%3E%3Cul%3E%3Cli%3EWas%20there%20a%20typo%20in%20the%20url%20or%20port?%3C/li%3E%3C/ul%3E%3C/div%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/experiment/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/experiment/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/experiment/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/experiment/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/experiment/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/experiment/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%3EMy%20custom%20error%20component%3C/h1%3E%3Cp%3E%20%3C!--%20--%3EUnable%20to%20connect.%20Is%20the%20computer%20able%20to%20access%20the%20url?%3C!--%20--%3E%20%3C/p%3E%3Chr/%3E%3Ccode%3Eit%20will%20be%20regenerated%20in%20each%2030min(press%20F5%20to%20check)%3C/code%3E',   'path': '/quotes',   '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'}];
-      globalThis[GLOBAL_KEY].context={
-   "fails": [],
-   "store": {
-      "name": "ok"
-   },
-   "param": {},
-   "await": "",
-   "logon": ""
-};
-      globalThis[GLOBAL_KEY].propers=[(props) => props?.shown === !1 ? { ...props, hidden: !0 } : props];
-      globalThis[GLOBAL_KEY].stylers={"/mnt/b/Repositorios/reactful/experiment/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/experiment/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/experiment/routes/profile/index.tsx":["h1 {\n   color: #ffb300;\n}\n\np {\n   color:red;\n}\n\n"]};
-      globalThis[GLOBAL_KEY].folders={"apis":"/apis","assets":"/assets","builds":"/builds","routes":"/routes","shares":"/shares","directives":"/directives","components":"/components"};
-      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]}}};
+
+      const GLOBAL_KEY = Symbol.for('settings')
+      const process = { env: {
+   "NODE_ENV": "development",
+   "SHELL": "/usr/bin/zsh",
+   "LSCOLORS": "Gxfxcxdxbxegedabagacad",
+   "USER_ZDOTDIR": "/root",
+   "COLORTERM": "truecolor",
+   "LESS": "-R",
+   "NVM_INC": "/root/.nvm/versions/node/v21.5.0/include/node",
+   "WSL2_GUI_APPS_ENABLED": "1",
+   "TERM_PROGRAM_VERSION": "1.88.0",
+   "WSL_DISTRO_NAME": "Debian",
+   "NODE": "/root/.nvm/versions/node/v21.5.0/bin/node",
+   "npm_config_local_prefix": "/mnt/b/Repositorios/reactful/",
+   "NAME": "JSR-DESKTOP",
+   "PWD": "/mnt/b/Repositorios/reactful",
+   "LOGNAME": "root",
+   "PORT": "3333",
+   "_": "/root/.bun/bin/bun",
+   "VSCODE_GIT_ASKPASS_NODE": "/root/.vscode-server/bin/5c3e652f63e798a5ac2f31ffd0d863669328dc4c/node",
+   "VSCODE_INJECTION": "1",
+   "HOME": "/root",
+   "LANG": "en_US.UTF-8",
+   "WSL_INTEROP": "/run/WSL/314_interop",
+   "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:",
+   "WAYLAND_DISPLAY": "wayland-0",
+   "GIT_ASKPASS": "/root/.vscode-server/bin/5c3e652f63e798a5ac2f31ffd0d863669328dc4c/extensions/git/dist/askpass.sh",
+   "NVM_DIR": "/root/.nvm",
+   "VSCODE_GIT_ASKPASS_EXTRA_ARGS": "",
+   "TERM": "xterm-256color",
+   "npm_package_name": "reactful",
+   "ZSH": "/root/.oh-my-zsh",
+   "ZDOTDIR": "/root",
+   "USER": "root",
+   "VSCODE_GIT_IPC_HANDLE": "/run/user/0/vscode-git-7034020a55.sock",
+   "DISPLAY": ":0",
+   "npm_lifecycle_event": "start",
+   "SHLVL": "1",
+   "NVM_CD_FLAGS": "-q",
+   "PAGER": "less",
+   "npm_config_user_agent": "bun/1.0.25 npm/? node/v21.6.0 linux x64",
+   "npm_execpath": "/root/.bun/bin/bun",
+   "XDG_RUNTIME_DIR": "/run/user/0/",
+   "MINIFY": "false",
+   "WSLENV": "VSCODE_WSL_EXT_LOCATION/up",
+   "npm_package_json": "/mnt/b/Repositorios/reactful/package.json",
+   "BUN_INSTALL": "/root/.bun",
+   "VSCODE_GIT_ASKPASS_MAIN": "/root/.vscode-server/bin/5c3e652f63e798a5ac2f31ffd0d863669328dc4c/extensions/git/dist/askpass-main.js",
+   "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/5c3e652f63e798a5ac2f31ffd0d863669328dc4c/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/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/PowerShell/7/:/mnt/c/Program Files/Docker/Docker/resources/bin:/mnt/c/Program Files (x86)/NVIDIA Corporation/PhysX/Common:/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",
+   "DBUS_SESSION_BUS_ADDRESS": "unix:path=/run/user/0/bus",
+   "NVM_BIN": "/root/.nvm/versions/node/v21.5.0/bin",
+   "HOSTTYPE": "x86_64",
+   "PULSE_SERVER": "unix:/mnt/wslg/PulseServer",
+   "npm_node_execpath": "/root/.nvm/versions/node/v21.5.0/bin/node",
+   "OLDPWD": "/mnt/b/Repositorios/reactful",
+   "TERM_PROGRAM": "vscode",
+   "VSCODE_IPC_HOOK_CLI": "/run/user/0/vscode-ipc-b36280cd-7ab7-435b-b258-e1d7d86cd6ec.sock"
+} }
+
+      globalThis[GLOBAL_KEY] ||= { queryId:'#root' }
+      globalThis[GLOBAL_KEY].renders=[{   'path': '/mnt/b/Repositorios/reactful/experiment/routes/clock.tsx',   'name': 'default$',   'time': '',   'mode': 'dynamic',   'href': '/mnt/b/Repositorios/reactful/experiment/routes/clock.tsx'},{   'path': '/mnt/b/Repositorios/reactful/experiment/routes/quotes.tsx',   'name': 'Quotes',   'time': 1800000,   'mode': 'periodic',   'href': '/mnt/b/Repositorios/reactful/experiment/routes/quotes.tsx'}];
+      globalThis[GLOBAL_KEY].caching=[{   'call': '',   'data': {      'description': 'Time zone clock...',      'title': 'Time Zone'   },   'path': '/mnt/b/Repositorios/reactful/experiment/routes/clock.tsx',   'name': 'default$',   'type': 'meta'},{   'call': '',   'data': {      'description': '...',      'title': 'Counter'   },   'path': '/mnt/b/Repositorios/reactful/experiment/routes/counter.tsx',   'name': 'default',   'type': 'meta'},{   'call': '',   'data': {      'description': 'Hello forms...',      'title': 'Hello'   },   'path': '/mnt/b/Repositorios/reactful/experiment/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/experiment/routes/profile/index.tsx',   'name': '',   'type': 'href'},{   'call': '',   'data': {      'description': 'Profile description',      'title': 'Profile'   },   'path': '/mnt/b/Repositorios/reactful/experiment/routes/profile/index.tsx',   'name': 'default',   'type': 'meta'},{   'call': '',   'data': {      'description': 'Philosophy quotes...',      'title': 'Quotes'   },   'path': '/mnt/b/Repositorios/reactful/experiment/routes/quotes.tsx',   'name': 'Quotes',   'type': 'meta'},{   'call': '',   'data': {      'charset': 'UTF-16',      'rating': 'general',      'keywords': 'hello, hi',      'title': 'System'   },   'path': '/mnt/b/Repositorios/reactful/experiment/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': '%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-4-10%3C!--%20--%3E%20%3C!--%20--%3E18:34:20%3C!--%20--%3E%20%3C/h3%3E%3Ch4%20await=%22%7B&quot;name&quot;:&quot;InnerAsyncComponent&quot;,&quot;path&quot;:&quot;/mnt/b/Repositorios/reactful/experiment/routes/clock.tsx&quot;%7D%22%20tag=%22h4%22%20uid=%2212%22%20class=%22TimeZone%22%3Eloading...%3C/h4%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/experiment/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/experiment/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/experiment/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/experiment/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%20class=%22hello%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%20style=%22text-align:right%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@client(true,%20...)%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%20style=%22text-align:right%22%20data=%22%5Bobject%20Object%5D%22%20bind=%22value%22%20placeholder=%22other%22/%3E%20=%20%3C!--%20--%3E99%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%3E11%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+%20RESTful%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%20RESTful%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/experiment/routes/login.tsx%22%20hidden=%22%22%20class=%22default%22%3E%3Ch1%3E%3Ci%20class=%22bi%20bi-undefined%20bi-user%22%20title=%22%22%3E%3C/i%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/experiment/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'}];
+      globalThis[GLOBAL_KEY].context={
+   "ref": "",
+   "fails": [],
+   "store": {
+      "name": "ok"
+   },
+   "param": {},
+   "await": "",
+   "logon": ""
+};
+      globalThis[GLOBAL_KEY].propers=[(props) => props?.shown === !1 ? { ...props, hidden: !0 } : props];
+      globalThis[GLOBAL_KEY].stylers={"/mnt/b/Repositorios/reactful/experiment/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/experiment/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/experiment/routes/profile/index.tsx":["h1 {\n   color: #ffb300;\n}\n\np {\n   color:red;\n}\n\n"]};
+      globalThis[GLOBAL_KEY].folders={"apis":"/apis","assets":"/assets","builds":"/builds","routes":"/routes","shares":"/shares","directives":"/directives","components":"/components"};
+      globalThis[GLOBAL_KEY].binding={"index":0,"count":0,"state":{},"react":{},"visit":[],"store":{},"ready":false};

package/templates/sampling/builds/system.html

@@ -1,27 +1,28 @@
-<!DOCTYPE html>
-<html lang="en">
-   <head>
-      <meta charset="UTF-8">
-      <meta name="viewport" content="width=device-width, initial-scale=1.0">
-      <meta name="description" content="Home page">
-      <meta name="theme-color" content="#333">
-      <link rel="stylesheet" href="/assets/markdown.css">
-      <link rel="stylesheet" href="/assets/default.css">
-      <link rel="manifest" href="/assets/manifest.json">
-      <title>Welcome</title>
-      <meta name='viewport' content='width=device-width, initial-scale=1.0' />
-      <meta name='description' content='Home page' />
-      <meta name='theme-color' content='#333' />
-      <meta name='title' content='Welcome' />
-   <script src='/mnt/b/Repositorios/reactful/experiment/builds/shared.js'></script>
-      <script type='module' src='/mnt/b/Repositorios/reactful/experiment/builds/bundle.js'></script></head>
-   <body>
-      <div id='root'>
-         <h1 tag="h1" uid="3" class="System">Server OS</h1>
-         <h2 tag="h2" uid="5" class="System">server side information</h2>
-         <pre tag="pre" uid="7"
-            class="System">Linux<!-- --> | <!-- -->x64<!-- --> | <!-- -->5.15.133.1-microsoft-standard-WSL2<!-- --> </pre>
-         <section tag="section" uid="9" class="System" hidden>DONT SHOW ME!</section>
-      </div>
-   </body>
+<!DOCTYPE html>
+<html lang="en">
+   <head>
+      <meta charset="UTF-8">
+      <meta name="viewport" content="width=device-width, initial-scale=1.0">
+      <meta name="description" content="Home page">
+      <meta name="theme-color" content="#333">
+      <link rel="stylesheet" href="/assets/bootstrap-icons.css">
+      <link rel="stylesheet" href="/assets/markdown.css">
+      <link rel="stylesheet" href="/assets/default.css">
+      <link rel="manifest" href="/assets/manifest.json">
+      <title>Welcome</title>
+      <meta name='viewport' content='width=device-width, initial-scale=1.0' />
+      <meta name='description' content='Home page' />
+      <meta name='theme-color' content='#333' />
+      <meta name='title' content='Welcome' />
+   <script src='/mnt/b/Repositorios/reactful/experiment/builds/shared.js'></script>
+      <script type='module' src='/mnt/b/Repositorios/reactful/experiment/builds/bundle.js'></script></head>
+   <body>
+      <div id='root'>
+         <h1 tag="h1" uid="3" class="System">Server OS</h1>
+         <h2 tag="h2" uid="5" class="System">server side information</h2>
+         <pre tag="pre" uid="7"
+            class="System">Linux<!-- --> | <!-- -->x64<!-- --> | <!-- -->5.15.133.1-microsoft-standard-WSL2<!-- --> </pre>
+         <section tag="section" uid="9" class="System" hidden>DONT SHOW ME!</section>
+      </div>
+   </body>
 </html>

package/templates/sampling/components/header.tsx

@@ -1,7 +1,7 @@
-import React from 'react'
-
-export const Header = props => <>
-   <h1 style={{color:'wheat'}}>{ props.children || props.title  }</h1>
-</>
-
+import React from 'react'
+
+export const Header = props => <>
+   <h1 style={{color:'wheat'}}>{ props.children || props.title  }</h1>
+</>
+
 export default { ok:true }

package/templates/sampling/components/hello.tsx

@@ -0,0 +1,9 @@
+import React from "react"
+
+interface Props {
+   name?: string
+}
+
+export const Hello = (props: Props) => <>
+   <h1>Hello { props.name || "World"} !</h1>
+</>

package/templates/sampling/components/icon.tsx

@@ -0,0 +1,11 @@
+import React from 'react'
+
+interface Props {
+   id: string
+   size?: string
+   children?: string
+}
+
+export const Icon = ({ id, size, children }: Props) => <>
+   <i className={`bi bi-${size} bi-${id}`} title={children || ""}></i>
+</>

package/templates/sampling/components/index.ts

@@ -0,0 +1,3 @@
+export * from './header'
+export * from './hello'
+export * from './icon'

package/templates/sampling/index.html

@@ -1,20 +1,21 @@
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-   <meta charset="UTF-8">
-   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-
-   <meta name="description" content="Home page" >
-   <meta name="theme-color" content="#333"/>
-
-   <link rel="stylesheet" href="/assets/markdown.css">
-   <link rel="stylesheet" href="/assets/default.css" />
-   <link rel="manifest" href="/assets/manifest.json" />
-
-   <title>Welcome</title>
-</head>
-<body>
-   <div id="root"></div>
-</body>
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+   <meta charset="UTF-8">
+   <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+   <meta name="description" content="Home page" >
+   <meta name="theme-color" content="#333"/>
+
+   <link rel="stylesheet" href="/assets/bootstrap-icons.css">
+   <link rel="stylesheet" href="/assets/markdown.css">
+   <link rel="stylesheet" href="/assets/default.css" />
+   <link rel="manifest" href="/assets/manifest.json" />
+
+   <title>Welcome</title>
+</head>
+<body>
+   <div id="root"></div>
+</body>
 </html>

package/templates/sampling/index.ts

@@ -1,19 +1,19 @@
-import React from "react"
-import { shown } from './directives'
-import { server } from "@reactful/server"
-
-const storage = { name: "ok" }
-
-await server("/routes", { failure, storage })
-     .inject(shown)
-     .render("#root")
-
-function failure(status, errors) {
-   const children: any[] = errors.map((x, i) => 
-      React.createElement('li', { key: i.toString() }, x))
-
-   return React.createElement('div', {}, [
-      React.createElement('h1', {}, status),
-      React.createElement('ul', {}, children),
-   ])
+import React from "react"
+import { shown } from './directives'
+import { server } from "@reactful/server"
+
+const storage = { name: "ok" }
+
+await server("/routes", { failure, storage })
+     .inject(shown)
+     .render("#root")
+
+function failure(status, errors) {
+   const children: any[] = errors.map((x, i) => 
+      React.createElement('li', { key: i.toString() }, x))
+
+   return React.createElement('div', {}, [
+      React.createElement('h1', {}, status),
+      React.createElement('ul', {}, children),
+   ])
 }

package/templates/sampling/routes/about.html

@@ -1,13 +1,13 @@
-<head>
-   <title>About</title>
-   <meta name="description" content="About page">
-</head>
-<body>
-   <h1>About</h1>
-   <p>
-   Lorem ipsum dolor sit amet consectetur adipisicing elit. 
-   Adipisci id eaque saepe ab numquam, nisi minus atque obcaecati, 
-   dignissimos facere accusamus nihil ipsam repudiandae praesentium, 
-   quia animi perspiciatis architecto fuga? 
-   </p>    
+<head>
+   <title>About</title>
+   <meta name="description" content="About page">
+</head>
+<body>
+   <h1>About</h1>
+   <p>
+   Lorem ipsum dolor sit amet consectetur adipisicing elit. 
+   Adipisci id eaque saepe ab numquam, nisi minus atque obcaecati, 
+   dignissimos facere accusamus nihil ipsam repudiandae praesentium, 
+   quia animi perspiciatis architecto fuga? 
+   </p>    
 </body>

package/templates/sampling/routes/clock.tsx

@@ -1,35 +1,36 @@
-import React, { Suspense } from 'react'
-import { server, seo } from '@reactful/web'
-
-const loading = <h3>Loading content...</h3>
-const address = "https://timeapi.io/api/Time/current/zone?timeZone=Europe/Amsterdam"
-
-//@ts-ignore
-@server("dynamic") 
-@seo('Time Zone', 'Time zone clock...')
-export default function(props: any) {
-   return <Suspense fallback={loading}>      
-         <TimeZone />
-      </Suspense>
-}
-
-async function TimeZone() {   
-   const response = await fetch(address)
-   const { year, month, day, hour, minute, seconds } = await response.json()
-   const time = `${hour}:${minute}:${seconds}`
-   const date = `${year}-${month}-${day}`
-
-   return <React.Fragment>
-      <h1>World Clock</h1>
-      <h2>Europe/Amistedan timezone</h2>
-      <h3 style={{color:'yellow'}}> {date} {time} </h3>
-      <Suspense fallback={loading}>
-         <InnerAsyncComponent />
-      </Suspense>
-   </React.Fragment>
-}
-
-async function InnerAsyncComponent() {
-   await new Promise(promise => setTimeout(promise, 1000))
-   return <code><mark>I'm a inner subcomponent !!!</mark></code>
-}
+import React, { Suspense } from 'react'
+import { server, seo, client } from '@reactful/web'
+import '@reactful/extensions'
+
+const loading = <h3>Loading content...</h3>
+const address = "https://timeapi.io/api/Time/current/zone?timeZone=Europe/Amsterdam"
+
+//@ts-ignore
+@server("dynamic") 
+@seo('Time Zone', 'Time zone clock...')
+export default function(props: any) {
+   return <Suspense fallback={loading}>      
+         <TimeZone />
+      </Suspense>
+}
+
+async function TimeZone() {   
+   const response = await fetch(address)
+   const { year, month, day, hour, minute, seconds } = await response.json()
+   const time = `${hour}:${minute}:${seconds}`
+   const date = `${year}-${month}-${day}`
+
+   return <React.Fragment>
+      <h1>World Clock</h1>
+      <h2>Europe/Amistedan timezone</h2>
+      <h3 style={{color:'yellow'}}> {date} {time} </h3>
+      <h4 await={InnerAsyncComponent}>loading...</h4>
+   </React.Fragment>
+}
+
+export async function InnerAsyncComponent(props, feeds) {
+   await new Promise(promise => setTimeout(promise, 1000))
+   return <>
+      <code><mark>async inner subcomponent !!!</mark></code>
+   </>
+}