@je-es/client 0.0.7 → 0.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +13 -19
- package/dist/main.cjs +2 -2
- package/dist/main.cjs.map +1 -1
- package/dist/main.d.cts +3 -3
- package/dist/main.d.ts +3 -3
- package/dist/main.js +2 -2
- package/dist/main.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
</div>
|
|
9
9
|
|
|
10
10
|
<div align="center">
|
|
11
|
-
<img src="https://img.shields.io/badge/v-0.0.
|
|
11
|
+
<img src="https://img.shields.io/badge/v-0.0.8-black"/>
|
|
12
12
|
<img src="https://img.shields.io/badge/🔥-@je--es-black"/>
|
|
13
13
|
<br>
|
|
14
14
|
<img src="https://github.com/je-es/client/actions/workflows/ci.yml/badge.svg" alt="CI" />
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
|
|
50
50
|
```bash
|
|
51
51
|
> space lint
|
|
52
|
-
> space build # Builds both JavaScript and
|
|
52
|
+
> space build # Builds both JavaScript and SCSS
|
|
53
53
|
> space test
|
|
54
54
|
> space start
|
|
55
55
|
> space watch # Development mode with auto-rebuild
|
|
@@ -88,11 +88,8 @@
|
|
|
88
88
|
```bash
|
|
89
89
|
> space start
|
|
90
90
|
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
📝 Found 8 SASS file(s)
|
|
94
|
-
💅 Styles compiled to ./static/client.css
|
|
95
|
-
✅ Build completed successfully!
|
|
91
|
+
- Building @je-es/client application...
|
|
92
|
+
- Build completed successfully!
|
|
96
93
|
|
|
97
94
|
Server started at http://localhost:3000
|
|
98
95
|
```
|
|
@@ -148,12 +145,12 @@
|
|
|
148
145
|
|
|
149
146
|
<div align="center"> <img src="./assets/img/line.png" alt="line" style="display: block; margin-top:20px;margin-bottom:20px;width:500px;"/> <br> </div>
|
|
150
147
|
|
|
151
|
-
- ###
|
|
148
|
+
- ### SCSS Styling System
|
|
152
149
|
|
|
153
150
|
```typescript
|
|
154
151
|
import { client } from '@je-es/client';
|
|
155
152
|
|
|
156
|
-
// Configure build with
|
|
153
|
+
// Configure build with SCSS support
|
|
157
154
|
const app = client({
|
|
158
155
|
build: {
|
|
159
156
|
entry: './app/main.ts',
|
|
@@ -164,9 +161,9 @@
|
|
|
164
161
|
splitChunks: false,
|
|
165
162
|
treeShaking: true,
|
|
166
163
|
},
|
|
167
|
-
//
|
|
164
|
+
// SCSS Configuration
|
|
168
165
|
styles: {
|
|
169
|
-
input: './app/style',
|
|
166
|
+
input: './app/style', // SCSS files directory
|
|
170
167
|
output: './static/css/client.css', // Compiled CSS output
|
|
171
168
|
},
|
|
172
169
|
},
|
|
@@ -487,9 +484,9 @@
|
|
|
487
484
|
treeShaking: true, // Remove unused code
|
|
488
485
|
},
|
|
489
486
|
|
|
490
|
-
//
|
|
487
|
+
// SCSS Configuration
|
|
491
488
|
styles: {
|
|
492
|
-
input: './app/style',
|
|
489
|
+
input: './app/style', // SCSS directory
|
|
493
490
|
output: './static/client.css', // CSS output
|
|
494
491
|
},
|
|
495
492
|
},
|
|
@@ -537,11 +534,8 @@
|
|
|
537
534
|
|
|
538
535
|
**Build Output:**
|
|
539
536
|
```
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
📝 Found 8 SASS file(s)
|
|
543
|
-
💅 Styles compiled to ./static/client.css
|
|
544
|
-
✅ Build completed successfully!
|
|
537
|
+
- Building @je-es/client application...
|
|
538
|
+
- Build completed successfully!
|
|
545
539
|
```
|
|
546
540
|
|
|
547
541
|
<div align="center"> <img src="./assets/img/line.png" alt="line" style="display: block; margin-top:20px;margin-bottom:20px;width:500px;"/> <br> </div>
|
|
@@ -574,7 +568,7 @@
|
|
|
574
568
|
👀 Watching for changes...
|
|
575
569
|
🔄 main.ts changed, rebuilding JS...
|
|
576
570
|
✅ JS rebuild complete
|
|
577
|
-
🔄 layout.
|
|
571
|
+
🔄 layout.scss changed, rebuilding CSS...
|
|
578
572
|
✅ CSS rebuild complete
|
|
579
573
|
```
|
|
580
574
|
|
package/dist/main.cjs
CHANGED
|
@@ -7,10 +7,10 @@
|
|
|
7
7
|
<p><strong>Route:</strong> ${t}</p>
|
|
8
8
|
<p><strong>Error:</strong> ${r}</p>
|
|
9
9
|
</div>
|
|
10
|
-
`;}}_handleScrollBehavior(t,e){if(t.hash){let r=document.getElementById(t.hash);if(r){r.scrollIntoView({behavior:this.scrollBehavior});return}}t.path!==e.path&&window.scrollTo({top:0,behavior:this.scrollBehavior});}_getCurrentPath(){if(this._internalPath!==null)return this._internalPath;if(this.mode==="hash")return window.location.hash.substring(1).split("?")[0]||"/";let t=window.location.pathname;return (!t||t==="blank"||t==="about:blank")&&(t="/"),this.base&&t.startsWith(this.base)&&(t=t.substring(this.base.length)),t||"/"}_buildFullPath(t){if(t.startsWith("http"))return t;let e=t.startsWith("/")?t:"/"+t;return this.base+e}_matchRoute(t){let e=t.split("?")[0].split("#")[0];for(let r of this.routes){let n=this._matchPath(r.path,e);if(n!==null)return {route:r,params:n}}return null}_matchPath(t,e){if(t==="*")return {};if(t===e)return {};let r=[],n=t.replace(/\*/g,".*").replace(/:([^/]+)/g,(a,u)=>(r.push(u),"([^/]+)")),s=new RegExp(`^${n}$`),i=e.match(s);return i?r.reduce((a,u,c)=>(a[u]=decodeURIComponent(i[c+1]),a),{}):null}_parseQuery(t){let e=t?t.includes("?")?t.split("?")[1].split("#")[0]:"":window.location.search.substring(1);return e?e.split("&").reduce((r,n)=>{let[s,i]=n.split("=").map(decodeURIComponent);return s&&(r[s]=i||""),r},{}):{}}},C=new E;function Ct(o){let t=o;return {async build(){if(!t.build){console.warn("No build configuration provided");return}console.log("\u{1F528} Building @je-es/client application...");try{await this._buildJS(),await this._buildStyles(),console.log("\u2705 Build completed successfully!");}catch(e){throw console.error("\u274C Build error:",e),e}},async _buildJS(){if(!t.build)return;let e=await Bun.build({entrypoints:[t.build.entry],outdir:t.build.output.substring(0,t.build.output.lastIndexOf("/")),target:"browser",minify:t.build.minify??false,sourcemap:t.build.sourcemap?"external":"none",splitting:t.build.optimization?.splitChunks??false,naming:{entry:t.build.output.substring(t.build.output.lastIndexOf("/")+1)}});if(!e.success)throw console.error("\u274C JS Build failed:",e.logs),new Error("JS Build failed")},async _buildStyles(){let e=t.build?.styles?.input||"./app/style",r=t.build?.styles?.output||"./static/client.css",n=path.dirname(r),s=r.split("/").pop()||"client.css";if(!fs.existsSync(e)){console.log("\u26A0\uFE0F No style directory found, skipping CSS build");return}try{fs.existsSync(n)||fs.mkdirSync(n,{recursive:!0});let i=this.
|
|
10
|
+
`;}}_handleScrollBehavior(t,e){if(t.hash){let r=document.getElementById(t.hash);if(r){r.scrollIntoView({behavior:this.scrollBehavior});return}}t.path!==e.path&&window.scrollTo({top:0,behavior:this.scrollBehavior});}_getCurrentPath(){if(this._internalPath!==null)return this._internalPath;if(this.mode==="hash")return window.location.hash.substring(1).split("?")[0]||"/";let t=window.location.pathname;return (!t||t==="blank"||t==="about:blank")&&(t="/"),this.base&&t.startsWith(this.base)&&(t=t.substring(this.base.length)),t||"/"}_buildFullPath(t){if(t.startsWith("http"))return t;let e=t.startsWith("/")?t:"/"+t;return this.base+e}_matchRoute(t){let e=t.split("?")[0].split("#")[0];for(let r of this.routes){let n=this._matchPath(r.path,e);if(n!==null)return {route:r,params:n}}return null}_matchPath(t,e){if(t==="*")return {};if(t===e)return {};let r=[],n=t.replace(/\*/g,".*").replace(/:([^/]+)/g,(a,u)=>(r.push(u),"([^/]+)")),s=new RegExp(`^${n}$`),i=e.match(s);return i?r.reduce((a,u,c)=>(a[u]=decodeURIComponent(i[c+1]),a),{}):null}_parseQuery(t){let e=t?t.includes("?")?t.split("?")[1].split("#")[0]:"":window.location.search.substring(1);return e?e.split("&").reduce((r,n)=>{let[s,i]=n.split("=").map(decodeURIComponent);return s&&(r[s]=i||""),r},{}):{}}},C=new E;function Ct(o){let t=o;return {async build(){if(!t.build){console.warn("No build configuration provided");return}console.log("\u{1F528} Building @je-es/client application...");try{await this._buildJS(),await this._buildStyles(),console.log("\u2705 Build completed successfully!");}catch(e){throw console.error("\u274C Build error:",e),e}},async _buildJS(){if(!t.build)return;let e=await Bun.build({entrypoints:[t.build.entry],outdir:t.build.output.substring(0,t.build.output.lastIndexOf("/")),target:"browser",minify:t.build.minify??false,sourcemap:t.build.sourcemap?"external":"none",splitting:t.build.optimization?.splitChunks??false,naming:{entry:t.build.output.substring(t.build.output.lastIndexOf("/")+1)}});if(!e.success)throw console.error("\u274C JS Build failed:",e.logs),new Error("JS Build failed")},async _buildStyles(){let e=t.build?.styles?.input||"./app/style",r=t.build?.styles?.output||"./static/client.css",n=path.dirname(r),s=r.split("/").pop()||"client.css";if(!fs.existsSync(e)){console.log("\u26A0\uFE0F No style directory found, skipping CSS build");return}try{fs.existsSync(n)||fs.mkdirSync(n,{recursive:!0});let i=this._collectScssFiles(e);if(i.length===0){console.log("\u26A0\uFE0F No SCSS files found, skipping CSS build");return}let a="";for(let c of i)try{let l=q__namespace.compile(c,{style:t.build?.minify?"compressed":"expanded",sourceMap:!!t.build?.sourcemap});a+=`
|
|
11
11
|
/* ${path.relative(e,c)} */
|
|
12
12
|
`,a+=l.css,a+=`
|
|
13
|
-
`;}catch(l){throw console.error(`\u274C Error compiling ${c}:`,l),l}let u=path.join(n,s);fs.writeFileSync(u,a,"utf-8"),t.build?.sourcemap&&fs.writeFileSync(`${u}.map`,JSON.stringify({version:3,sources:i.map(c=>path.relative(n,c)),names:[],mappings:""}),"utf-8");}catch(i){throw console.error("\u274C CSS Build failed:",i),i}},
|
|
13
|
+
`;}catch(l){throw console.error(`\u274C Error compiling ${c}:`,l),l}let u=path.join(n,s);fs.writeFileSync(u,a,"utf-8"),t.build?.sourcemap&&fs.writeFileSync(`${u}.map`,JSON.stringify({version:3,sources:i.map(c=>path.relative(n,c)),names:[],mappings:""}),"utf-8");}catch(i){throw console.error("\u274C CSS Build failed:",i),i}},_collectScssFiles(e){let r=[];if(!fs.existsSync(e))return r;let n=fs.readdirSync(e);for(let s of n){let i=path.join(e,s),a=fs.statSync(i);a.isDirectory()?r.push(...this._collectScssFiles(i)):a.isFile()&&path.extname(s)===".scss"&&!s.startsWith("_")&&r.push(i);}return r.sort()},async watch(){console.log("\u{1F440} Watching for changes..."),await this.build();let{watch:e}=await import('fs');if(t.build?.entry){let n=path.dirname(t.build.entry);e(n,{recursive:true},async(s,i)=>{if(i&&(i.endsWith(".ts")||i.endsWith(".tsx"))){console.log(`\u{1F504} ${i} changed, rebuilding JS...`);try{await this._buildJS(),console.log("\u2705 JS rebuild complete");}catch(a){console.error("\u274C JS rebuild failed:",a);}}});}let r="./app/style";fs.existsSync(r)&&e(r,{recursive:true},async(n,s)=>{if(s&&s.endsWith(".scss")){console.log(`\u{1F504} ${s} changed, rebuilding CSS...`);try{await this._buildStyles(),console.log("\u2705 CSS rebuild complete");}catch(i){console.error("\u274C CSS rebuild failed:",i);}}});},init(){if(t.api){let e={baseURL:t.api.baseURL,timeout:t.api.timeout,headers:t.api.headers};t.api.interceptors&&(e.interceptors={request:t.api.interceptors.request||null,response:t.api.interceptors.response||null,error:t.api.interceptors.error||null}),capi.configureApi(e);}t.router&&t.app?.routes&&(C.init(t.app.routes,t.router.mode,t.router.base),t.router.beforeEach&&C.beforeEach(t.router.beforeEach),t.router.afterEach&&C.afterEach(t.router.afterEach)),t.app?.root&&(document.querySelector(t.app.root)||console.error(`\u274C Root element "${t.app.root}" not found`)),t.devTools?.enabled&&this._enableDevTools();},_enableDevTools(){window.__JEES_DEV__={router:C,config:t,version:"0.0.1"};},getConfig(){return t}}}var P=class{constructor(t){this._subscribers=new Set;this._storage=null;this._middleware=[];this._isHydrating=false;if(this._persist=t.persist??false,this._storageKey=t.storageKey||`store_${Date.now()}`,this._persist&&typeof window<"u"&&(this._storage=t.storage==="sessionStorage"?sessionStorage:localStorage),this._persist&&this._storage){let e=this._loadFromStorage();this._state=e!==null?e:t.state;}else this._state=t.state;t.middleware&&(this._middleware=t.middleware);}get state(){return {...this._state}}set state(t){this.setState(t);}setState(t,e){let r={...this._state},n=typeof t=="function"?t(r):t;this._state={...r,...n};for(let s of this._middleware)try{s(this._state,e);}catch(i){console.error("Store middleware error:",i);}this._persist&&!this._isHydrating&&this._saveToStorage(),this._notify();}get(t){return this._state[t]}set(t,e,r){this.setState({[t]:e},r);}subscribe(t){return this._subscribers.add(t),t(this._state),()=>{this._subscribers.delete(t);}}subscribeToKey(t,e){let r=this._state[t],n=s=>{let i=s[t];r!==i&&(r=i,e(i));};return this.subscribe(n)}use(t){this._middleware.push(t);}clear(){if(this._state={},this._persist&&this._storage)try{this._storage.removeItem(this._storageKey);}catch(t){console.error("Failed to clear storage:",t);}this._notify();}reset(t){this._state={...t},this._persist&&this._saveToStorage(),this._notify();}hydrate(){if(!this._persist||!this._storage){console.warn("Cannot hydrate: persistence not enabled");return}this._isHydrating=true;let t=this._loadFromStorage();t!==null&&(this._state=t,this._notify()),this._isHydrating=false;}getSnapshot(){return {state:{...this._state},subscribers:this._subscribers.size,storageKey:this._storageKey}}batch(t){let e=this._notify.bind(this),r=false;this._notify=()=>{r=true;};try{t();}finally{this._notify=e,r&&this._notify();}}_notify(){let t={...this._state};for(let e of this._subscribers)try{e(t);}catch(r){console.error("Store subscriber error:",r);}}_loadFromStorage(){if(!this._storage)return null;try{let t=this._storage.getItem(this._storageKey);return t?JSON.parse(t):null}catch(t){return console.error("Failed to load from storage:",t),null}}_saveToStorage(){if(this._storage)try{this._storage.setItem(this._storageKey,JSON.stringify(this._state));}catch(t){console.error("Failed to save to storage:",t),t instanceof DOMException&&t.name==="QuotaExceededError"&&console.warn("Storage quota exceeded");}}destroy(){this._subscribers.clear(),this._middleware=[],this._state={};}};function j(o){return new P(o)}function St(o,t){let e=j({state:{value:t(...o.map(r=>r.state))}});for(let r of o)r.subscribe(()=>{e.setState({value:t(...o.map(n=>n.state))});});return e}function xt(o,t,e){return o.subscribe(n=>{let s=e(n);Object.assign(t,s),typeof t.update=="function"&&t.update();})}function _(o,t){if(t&&typeof t=="object"&&"kind"in t){let i=t.name;return t.addInitializer(function(){let a=this;a.constructor.__reactiveProps__||(a.constructor.__reactiveProps__=[]),a.constructor.__reactiveProps__.includes(i)||a.constructor.__reactiveProps__.push(i);}),function(a){let u=this,c=`_state_${i}`;return u[c]=a,Object.defineProperty(this,i,{get(){return this[c]},set(l){let h=this,f=h[c];f!==l&&(h[c]=l,typeof h._invalidateAllComputed=="function"&&h._invalidateAllComputed(),typeof h._triggerWatchers=="function"&&h._triggerWatchers(i,l,f),h._isMounted&&typeof h.update=="function"&&h.update());},enumerable:true,configurable:true}),a}}let e=t,r=o.constructor;r.__reactiveProps__||(r.__reactiveProps__=[]),r.__reactiveProps__.includes(e)||r.__reactiveProps__.push(e);let n=`_state_${e}`,s=`_state_init_${e}`;Object.defineProperty(o,e,{get(){let i=this;if(i[s])return i[n]},set(i){let a=this;if(!a[s]){a[n]=i,a[s]=true;return}let u=a[n];u!==i&&(a[n]=i,typeof a._invalidateAllComputed=="function"&&a._invalidateAllComputed(),typeof a._triggerWatchers=="function"&&a._triggerWatchers(e,i,u),a._isMounted&&typeof a.update=="function"&&a.update());},enumerable:true,configurable:true});}function kt(o,t,e){if(t&&typeof t=="object"&&"kind"in t){let a=t;if(a.kind!=="getter")throw new Error("@computed can only be used on getters");let u=o,c=a.name,l=`_computed_cache_${c}`,h=`_computed_dirty_${c}`;return function(){let f=this;return f[h]===void 0&&(f[h]=true),f[h]===true&&(f[l]=u.call(this),f[h]=false),f[l]}}let r=t;if(!e)throw new Error("@computed requires a property descriptor");let n=e.get;if(!n)throw new Error("@computed can only be used on getters");let s=`_computed_cache_${r}`,i=`_computed_dirty_${r}`;return {get(){let a=this;return a[i]===void 0&&(a[i]=true),a[i]===true&&(a[s]=n.call(this),a[i]=false),a[s]},enumerable:e.enumerable,configurable:e.configurable}}function Et(o){function t(e,r,n){if(r&&typeof r=="object"&&"kind"in r){if(r.kind!=="method")throw new Error("@watch can only be used on methods");let u=r.name;r.addInitializer(function(){let c=this;c.constructor.__watchers__||(c.constructor.__watchers__={}),c.constructor.__watchers__[o]||(c.constructor.__watchers__[o]=[]),c.constructor.__watchers__[o].includes(u)||c.constructor.__watchers__[o].push(u);});return}let s=r;if(!n)throw new Error("@watch requires a property descriptor");let a=e.constructor;return a.__watchers__||(a.__watchers__={}),a.__watchers__[o]||(a.__watchers__[o]=[]),a.__watchers__[o].includes(s)||a.__watchers__[o].push(s),n}return t}var g=class extends m{constructor(e){super(e);this.fields=[];this.formData={};this.isSubmitting=false;this.submitError="";this.submitSuccess=false;this.fields=this.props.fields.map(r=>({...r,error:void 0,touched:false}));for(let r of this.fields)this.formData[r.name]=r.value||"";}onMount(){}handleChange(e,r){this.formData[e]=r;let n=this.fields.find(s=>s.name===e);n&&this.props.autoValidate&&(n.error=this.validateField(n,r),n.touched=true),this.update();}handleBlur(e){let r=this.fields.find(n=>n.name===e);r&&(r.touched=true,r.error=this.validateField(r,this.formData[e]),this.update());}validateField(e,r){let n=e.validation;if(!n)return;if(n.required&&!r)return n.message||`${e.label||e.name} is required`;if(!r)return;let s=String(r);if(n.minLength&&s.length<n.minLength)return n.message||`Minimum ${n.minLength} characters required`;if(n.maxLength&&s.length>n.maxLength)return n.message||`Maximum ${n.maxLength} characters allowed`;if(n.min!==void 0&&Number(r)<n.min)return n.message||`Minimum value is ${n.min}`;if(n.max!==void 0&&Number(r)>n.max)return n.message||`Maximum value is ${n.max}`;if(n.pattern&&!n.pattern.test(s))return n.message||"Invalid format";if(n.email&&!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(s))return n.message||"Invalid email address";if(n.url&&!/^https?:\/\/.+/.test(s))return n.message||"Invalid URL";if(n.custom){let i=n.custom(r);if(i!==true)return typeof i=="string"?i:"Validation failed"}}validateForm(){let e=true;for(let r of this.fields){let n=this.validateField(r,this.formData[r.name]);r.error=n,r.touched=true,n&&(e=false);}return this.update(),e}async handleSubmit(e){if(e.preventDefault(),!this.validateForm()){let r=this.fields.find(n=>n.error);r&&document.querySelector(`[name="${r.name}"]`)?.focus();return}this.isSubmitting=true,this.submitError="",this.submitSuccess=false,this.update();try{if(this.props.onSubmit)await this.props.onSubmit(this.formData,e);else if(this.props.endpoint){let r=await capi.api({method:this.props.method||"POST",url:this.props.endpoint,data:this.formData});this.submitSuccess=!0,this.props.onSuccess&&this.props.onSuccess(r.data);}}catch(r){let n=r instanceof Error?r.message:"Submission failed";this.submitError=n,this.props.onError&&this.props.onError(r);}finally{this.isSubmitting=false,this.update();}}renderField(e){let r=this.formData[e.name]||"",n=e.touched&&e.error;switch(e.type){case "textarea":return vdom.html`
|
|
14
14
|
<div class="form-field ${e.className||""}">
|
|
15
15
|
${e.label?vdom.html`<label for=${e.name}>${e.label}</label>`:""}
|
|
16
16
|
<textarea
|