@unsetsoft/ryunixjs 1.1.7-canary.6 → 1.1.7-canary.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/dist/Ryunix.js +49 -3
- package/dist/Ryunix.min.js +1 -1
- package/package.json +1 -1
package/dist/Ryunix.js
CHANGED
|
@@ -49,6 +49,10 @@
|
|
|
49
49
|
DELETION: Symbol('ryunix.reconciler.status.deletion').toString(),
|
|
50
50
|
});
|
|
51
51
|
|
|
52
|
+
const generateHash = (prefix) => {
|
|
53
|
+
return `${prefix}-${Math.random().toString(36).substring(2, 9)}`
|
|
54
|
+
};
|
|
55
|
+
|
|
52
56
|
const Fragment = (props) => {
|
|
53
57
|
return props.children
|
|
54
58
|
};
|
|
@@ -71,10 +75,16 @@
|
|
|
71
75
|
*/
|
|
72
76
|
|
|
73
77
|
const createElement = (type, props, ...children) => {
|
|
78
|
+
const key =
|
|
79
|
+
props && props.key
|
|
80
|
+
? generateHash(props.key)
|
|
81
|
+
: generateHash(RYUNIX_TYPES.Ryunix_ELEMENT.toString());
|
|
82
|
+
|
|
74
83
|
return {
|
|
75
84
|
type,
|
|
76
85
|
props: {
|
|
77
86
|
...props,
|
|
87
|
+
key,
|
|
78
88
|
children: children
|
|
79
89
|
.flat()
|
|
80
90
|
.map((child) =>
|
|
@@ -301,18 +311,47 @@
|
|
|
301
311
|
}
|
|
302
312
|
};
|
|
303
313
|
|
|
314
|
+
/**
|
|
315
|
+
* This function reconciles the children of a fiber node with a new set of elements, creating new
|
|
316
|
+
* fibers for new elements, updating existing fibers for elements with the same type, and marking old
|
|
317
|
+
* fibers for deletion if they are not present in the new set of elements.
|
|
318
|
+
* @param wipFiber - A work-in-progress fiber object representing a component or element in the virtual
|
|
319
|
+
* DOM tree.
|
|
320
|
+
* @param elements - an array of elements representing the new children to be rendered in the current
|
|
321
|
+
* fiber's subtree
|
|
322
|
+
*/
|
|
323
|
+
const shouldComponentUpdate = (oldProps, newProps) => {
|
|
324
|
+
// Comparar las propiedades antiguas y nuevas
|
|
325
|
+
return (
|
|
326
|
+
!oldProps ||
|
|
327
|
+
!newProps ||
|
|
328
|
+
Object.keys(oldProps).length !== Object.keys(newProps).length ||
|
|
329
|
+
Object.keys(newProps).some((key) => oldProps[key] !== newProps[key])
|
|
330
|
+
)
|
|
331
|
+
};
|
|
332
|
+
|
|
304
333
|
const reconcileChildren = (wipFiber, elements) => {
|
|
305
334
|
let index = 0;
|
|
306
335
|
let oldFiber = wipFiber.alternate && wipFiber.alternate.child;
|
|
307
|
-
let prevSibling;
|
|
336
|
+
let prevSibling = null;
|
|
308
337
|
|
|
309
|
-
|
|
338
|
+
const oldFibersMap = new Map();
|
|
339
|
+
|
|
340
|
+
while (oldFiber) {
|
|
341
|
+
const oldKey = oldFiber.props.key || oldFiber.type;
|
|
342
|
+
oldFibersMap.set(oldKey, oldFiber);
|
|
343
|
+
oldFiber = oldFiber.sibling;
|
|
344
|
+
}
|
|
345
|
+
|
|
346
|
+
while (index < elements.length) {
|
|
310
347
|
const element = elements[index];
|
|
348
|
+
const key = element.props.key || element.type;
|
|
349
|
+
const oldFiber = oldFibersMap.get(key);
|
|
311
350
|
let newFiber;
|
|
312
351
|
|
|
313
352
|
const sameType = oldFiber && element && element.type == oldFiber.type;
|
|
314
353
|
|
|
315
|
-
if (sameType) {
|
|
354
|
+
if (sameType && !shouldComponentUpdate(oldFiber.props, element.props)) {
|
|
316
355
|
newFiber = {
|
|
317
356
|
type: oldFiber.type,
|
|
318
357
|
props: element.props,
|
|
@@ -332,8 +371,10 @@
|
|
|
332
371
|
effectTag: EFFECT_TAGS.PLACEMENT,
|
|
333
372
|
};
|
|
334
373
|
}
|
|
374
|
+
|
|
335
375
|
if (oldFiber && !sameType) {
|
|
336
376
|
oldFiber.effectTag = EFFECT_TAGS.DELETION;
|
|
377
|
+
wipFiber.effects = wipFiber.effects || [];
|
|
337
378
|
vars.deletions.push(oldFiber);
|
|
338
379
|
}
|
|
339
380
|
|
|
@@ -350,6 +391,11 @@
|
|
|
350
391
|
prevSibling = newFiber;
|
|
351
392
|
index++;
|
|
352
393
|
}
|
|
394
|
+
|
|
395
|
+
oldFibersMap.forEach((oldFiber) => {
|
|
396
|
+
oldFiber.effectTag = EFFECT_TAGS.DELETION;
|
|
397
|
+
vars.deletions.push(oldFiber);
|
|
398
|
+
});
|
|
353
399
|
};
|
|
354
400
|
|
|
355
401
|
/**
|
package/dist/Ryunix.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("lodash")):"function"==typeof define&&define.amd?define(["exports","lodash"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Ryunix={},e.lodash)}(this,(function(e,t){"use strict";let o={containerRoot:null,nextUnitOfWork:null,currentRoot:null,wipRoot:null,deletions:null,wipFiber:null,hookIndex:null,effects:null};const n=/[A-Z]/g,r=Object.freeze({TEXT_ELEMENT:Symbol("text.element"),Ryunix_ELEMENT:Symbol("ryunix.element"),RYUNIX_EFFECT:Symbol("ryunix.effect"),RYUNIX_MEMO:Symbol("ryunix.memo"),RYUNIX_URL_QUERY:Symbol("ryunix.urlQuery"),RYUNIX_REF:Symbol("ryunix.ref"),RYUNIX_STORE:Symbol("ryunix.store"),RYUNIX_REDUCE:Symbol("ryunix.reduce")}),
|
|
1
|
+
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("lodash")):"function"==typeof define&&define.amd?define(["exports","lodash"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Ryunix={},e.lodash)}(this,(function(e,t){"use strict";let o={containerRoot:null,nextUnitOfWork:null,currentRoot:null,wipRoot:null,deletions:null,wipFiber:null,hookIndex:null,effects:null};const n=/[A-Z]/g,r=Object.freeze({TEXT_ELEMENT:Symbol("text.element"),Ryunix_ELEMENT:Symbol("ryunix.element"),RYUNIX_EFFECT:Symbol("ryunix.effect"),RYUNIX_MEMO:Symbol("ryunix.memo"),RYUNIX_URL_QUERY:Symbol("ryunix.urlQuery"),RYUNIX_REF:Symbol("ryunix.ref"),RYUNIX_STORE:Symbol("ryunix.store"),RYUNIX_REDUCE:Symbol("ryunix.reduce")}),s=Object.freeze({object:"object",function:"function",style:"ryunix-style",className:"ryunix-class",children:"children",boolean:"boolean",string:"string"}),i=Object.freeze({style:"style",className:"className"}),l=Object.freeze({PLACEMENT:Symbol("ryunix.reconciler.status.placement").toString(),UPDATE:Symbol("ryunix.reconciler.status.update").toString(),DELETION:Symbol("ryunix.reconciler.status.deletion").toString()}),a=e=>`${e}-${Math.random().toString(36).substring(2,9)}`,c=(e,t,...o)=>{const n=t&&t.key?a(t.key):a(r.Ryunix_ELEMENT.toString());return{type:e,props:{...t,key:n,children:o.flat().map((e=>typeof e===s.object?e:u(e)))}}},u=e=>({type:r.TEXT_ELEMENT,props:{nodeValue:e,children:[]}}),p=e=>e.startsWith("on"),f=e=>e!==s.children&&!p(e),d=(e,t)=>o=>e[o]!==t[o],h=e=>t=>!(t in e),y=e=>{e.hooks&&e.hooks.filter((e=>e.tag===r.RYUNIX_EFFECT&&e.cancel)).forEach((e=>{e.cancel()}))},m=e=>{e.hooks&&e.hooks.filter((e=>e.tag===r.RYUNIX_EFFECT&&e.effect)).forEach((e=>{e.cancel=e.effect()}))},E=(e,t,o)=>{Object.keys(t).filter(p).filter((e=>h(o)(e)||d(t,o)(e))).forEach((o=>{const n=o.toLowerCase().substring(2);e.removeEventListener(n,t[o])})),Object.keys(t).filter(f).filter(h(o)).forEach((t=>{e[t]=""})),Object.keys(o).filter(f).filter(d(t,o)).forEach((n=>{if(n===s.style)w(e,o["ryunix-style"]);else if(n===i.style)w(e,o.style);else if(n===s.className){if(""===o["ryunix-class"])throw new Error("data-class cannot be empty.");t["ryunix-class"]&&e.classList.remove(...t["ryunix-class"].split(/\s+/)),e.classList.add(...o["ryunix-class"].split(/\s+/))}else if(n===i.className){if(""===o.className)throw new Error("className cannot be empty.");t.className&&e.classList.remove(...t.className.split(/\s+/)),e.classList.add(...o.className.split(/\s+/))}else e[n]=o[n]})),Object.keys(o).filter(p).filter(d(t,o)).forEach((t=>{const n=t.toLowerCase().substring(2);e.addEventListener(n,o[t])}))},w=(e,t)=>{e.style=Object.keys(t).reduce(((e,o)=>e+=`${o.replace(n,(function(e){return"-"+e.toLowerCase()}))}: ${t[o]};`),"")},b=e=>{if(!e)return;let t=e.parent;for(;!t.dom;)t=t.parent;const o=t.dom;if(e.effectTag===l.PLACEMENT&&null!=e.dom)o.appendChild(e.dom),m(e);else if(e.effectTag===l.UPDATE&&null!=e.dom)y(e),E(e.dom,e.alternate.props,e.props),m(e);else if(e.effectTag===l.DELETION)return k(e,o),void y(e);b(e.child),b(e.sibling)},k=(e,t)=>{e.dom?t.removeChild(e.dom):k(e.child,t)},R=(e,t)=>!e||!t||Object.keys(e).length!==Object.keys(t).length||Object.keys(t).some((o=>e[o]!==t[o])),g=(e,t)=>{let n=0,r=e.alternate&&e.alternate.child,s=null;const i=new Map;for(;r;){const e=r.props.key||r.type;i.set(e,r),r=r.sibling}for(;n<t.length;){const r=t[n],a=r.props.key||r.type,c=i.get(a);let u;const p=c&&r&&r.type==c.type;p&&!R(c.props,r.props)&&(u={type:c.type,props:r.props,dom:c.dom,parent:e,alternate:c,effectTag:l.UPDATE}),r&&!p&&(u={type:r.type,props:r.props,dom:null,parent:e,alternate:null,effectTag:l.PLACEMENT}),c&&!p&&(c.effectTag=l.DELETION,e.effects=e.effects||[],o.deletions.push(c)),c&&(c=c.sibling),0===n?e.child=u:r&&(s.sibling=u),s=u,n++}i.forEach((e=>{e.effectTag=l.DELETION,o.deletions.push(e)}))},x=e=>{e.dom||(e.dom=(e=>{const t=e.type==r.TEXT_ELEMENT?document.createTextNode(""):document.createElement(e.type);return E(t,{},e.props),t})(e)),g(e,e.props.children)},N=e=>{let t=!1;for(;o.nextUnitOfWork&&!t;)o.nextUnitOfWork=F(o.nextUnitOfWork),t=e.timeRemaining()<1;!o.nextUnitOfWork&&o.wipRoot&&(o.deletions.forEach(b),o.wipRoot&&o.wipRoot.child&&(b(o.wipRoot.child),o.currentRoot=o.wipRoot),o.effects.forEach((e=>{try{e()}catch(e){console.error("Error in effect:",e)}})),o.effects=[],o.wipRoot=null),requestIdleCallback(N)},F=e=>{if(e.type instanceof Function?(e=>{o.wipFiber=e,o.hookIndex=0,o.wipFiber.hooks=[];const t=e.type(e.props);let n=Array.isArray(t)?t:[t];g(e,n)})(e):x(e),e.child)return e.child;let t=e;for(;t;){if(t.sibling)return t.sibling;t=t.parent}},T=(e,t)=>{var n;return o.wipRoot={dom:t,props:{children:[e]},alternate:o.currentRoot},o.nextUnitOfWork=o.wipRoot,o.deletions=[],n=o.wipRoot,o.nextUnitOfWork=n,o.wipRoot=n,o.deletions=[],o.hookIndex=0,o.effects=[],requestIdleCallback(N),o.wipRoot},I=e=>{const t=o.wipFiber.alternate&&o.wipFiber.alternate.hooks&&o.wipFiber.alternate.hooks[o.hookIndex],n={state:t?t.state:e,queue:[]};(t?t.queue:[]).forEach((e=>{n.state=typeof e===s.function?e(n.state):e}));return o.wipFiber.hooks.push(n),o.hookIndex++,[n.state,e=>{n.queue.push(e),o.wipRoot={dom:o.currentRoot.dom,props:o.currentRoot.props,alternate:o.currentRoot},o.nextUnitOfWork=o.wipRoot,o.deletions=[]}]},O=(e,n)=>{const s=o.wipFiber.alternate&&o.wipFiber.alternate.hooks&&o.wipFiber.alternate.hooks[o.hookIndex],i={type:r.RYUNIX_EFFECT,deps:n,cleanup:s?.cleanup};(!s||!t.isEqual(s.deps,n))&&o.effects.push((()=>{"function"==typeof i.cleanup&&i.cleanup();const t=e();"function"==typeof t&&(i.cleanup=t)})),o.wipFiber.hooks[o.hookIndex]=i,o.hookIndex++},L=e=>{const t=o.wipFiber.alternate&&o.wipFiber.alternate.hooks&&o.wipFiber.alternate.hooks[o.hookIndex],n={type:r.RYUNIX_REF,value:t?t.value:{current:e}};return o.wipFiber.hooks[o.hookIndex]=n,o.hookIndex++,n.value},U=(e,n)=>{const s=o.wipFiber.alternate&&o.wipFiber.alternate.hooks&&o.wipFiber.alternate.hooks[o.hookIndex],i={type:r.RYUNIX_MEMO,value:null,deps:n};return s&&t.isEqual(s.deps,i.deps)?i.value=s.value:i.value=e(),o.wipFiber.hooks[o.hookIndex]=i,o.hookIndex++,i.value},v=(e,t)=>U((()=>e),t),_=()=>{const e=new URLSearchParams(window.location.search),t={};for(let[o,n]of e.entries())t[o]=n;return t},S=e=>{const[t,o]=I(window.location.pathname),n=(e,t)=>{const o=t.split("?")[0],r=e.find((e=>e.NotFound)),s=r?{route:{component:r.NotFound},params:{}}:{route:{component:null},params:{}};for(const r of e){if(r.subRoutes){const e=n(r.subRoutes,t);if(e)return e}if("*"===r.path)return s;if(!r.path||"string"!=typeof r.path){console.warn("Invalid route detected:",r),console.info("if you are using { NotFound: NotFound } please add { path: '*', NotFound: NotFound }");continue}const e=[],i=new RegExp(`^${r.path.replace(/:\w+/g,(t=>(e.push(t.substring(1)),"([^/]+)")))}$`),l=o.match(i);if(l){return{route:r,params:e.reduce(((e,t,o)=>(e[t]=l[o+1],e)),{})}}}return s},r=e=>{window.history.pushState({},"",e),i(e)},i=e=>{const t=e.split("?")[0];o(t)};O((()=>{const e=()=>i(window.location.pathname);return window.addEventListener("popstate",e),()=>window.removeEventListener("popstate",e)}),[]);const l=n(e,t)||{};return{Children:()=>{const e=_(),{route:t}=l;return t&&t.component&&typeof t.component===s.function?t.component({params:l.params||{},query:e}):(console.error("Component not found for current path or the component is not a valid function:",l),null)},NavLink:({to:e,...t})=>c("a",{href:e,onClick:t=>{t.preventDefault(),r(e)},...t},t.children),navigate:r}};var C={createElement:c,render:T,init:(e,t="__ryunix")=>{o.containerRoot=document.getElementById(t);return T(e,o.containerRoot)},Fragment:e=>e.children,Hooks:Object.freeze({__proto__:null,useCallback:v,useEffect:O,useMemo:U,useQuery:_,useRef:L,useRouter:S,useStore:I})};window.Ryunix=C,e.Image=({src:e,...t})=>{const o="true"===t.optimization?(({src:e,props:t})=>{const o=new URLSearchParams,n=!e.startsWith("http")||!e.startsWith("https");t.width&&o.set("width",t.width),t.height&&o.set("width",t.height),t.quality&&o.set("quality",t.quality);const r=t.extension?`@${t.extension}`:"",s="http://localhost:3000"===window.location.origin||"http://localhost:5173"===window.location.origin||"http://localhost:4173"===window.location.origin;return n?s?(console.warn("Image optimizations only work with full links and must not contain localhost."),e):`${window.location.origin}/${e}`:`https://image.unsetsoft.com/image/${e}${r}?${o.toString()}`})({src:e,props:t}):e;return c("img",{src:o,props:t},null)},e.default=C,e.useCallback=v,e.useEffect=O,e.useMemo=U,e.useQuery=_,e.useRef=L,e.useRouter=S,e.useStore=I,Object.defineProperty(e,"__esModule",{value:!0})}));
|