solid-alive 0.1.0 → 0.1.2

package/dist/index.cjs

@@ -1 +1 @@
-"use strict";var e=require("solid-js/web"),l=require("solid-js/store"),o=require("solid-js"),t=o.createContext({elements:{},closeSymbol:Symbol("close"),insertElement:()=>{},onDeactivated:()=>{},onActivated:()=>{},removeAliveElement:()=>{},saveScroll:()=>{},setCurrentComponentId:()=>{},saveElScroll:()=>{},resetElScroll:()=>!0,removeScrollEl:()=>!0});var r={appear:"index-module_appear__MaHzX",_appear:"index-module__appear__7KeRW",toLeft:"index-module_toLeft__s1PDL",_toLeft:"index-module__toLeft__SD-Zp"};let n=0,i=0,a=null;exports.AliveProvider=function(o){var[r,n]=l.createStore();let i=Symbol("close"),a=i,s=new Map,c=new Map,v=new Map;var d=e=>{let l=e.id,o=s.get(l),t=c.get(l),r=v.get(l);s.delete(l),c.delete(l),v.delete(l),n([l],Object.assign(Object.assign({},e),{onActivated:o,onDeactivated:t,domList:r}))},u=e=>{var l;if(Reflect.has(r,e)){var o=null===(l=r[e])||void 0===l?void 0:l.children;null==o||o.forEach((l=>l!==e&&u(l))),n((l=>{var o,t,r,n;return null===(t=(o=l[e]).onDeactivated)||void 0===t||t.call(o),l[e].component=null,null===(n=(r=l[e]).dispose)||void 0===n||n.call(r),l[e].dispose=null,l[e].owner=null,l[e].onActivated=null,l[e].onDeactivated=null,l[e].scroll=null,l[e].id="",l[e].children=null,l[e].domList=null,l[e]=null,delete l[e],l}))}},m=e=>{if(null==e)for(const e of Object.values(r))u(e.id);else u(e)},f=e=>{a=e},p=(e,o)=>{Reflect.has(r,e)&&n(l.produce((l=>{l[e].scroll=Object.assign({},o)})))},E=e=>{a!==i&&s.set(a,e)},L=e=>{a!==i&&c.set(a,e)},S=(e,l)=>{var o,t;if(a!==i){var r=(null!==(o=v.get(a))&&void 0!==o?o:new Map([])).set(e,{top:0,left:0});v.set(a,r),null===(t=null==l?void 0:l())||void 0===t||t(e)}},h=e=>{var l;for(const o of Object.values(r))if(null===(l=o.domList)||void 0===l?void 0:l.has(e))return o.domList.delete(e),e.scrollTop=0,e.scrollLeft=0,!0;return!1},A=e=>{var l;for(const o of Object.values(r))if(null===(l=o.domList)||void 0===l?void 0:l.has(e))return o.domList.set(e,{top:0,left:0}),e.scrollTop=0,e.scrollLeft=0,!0;return!1};return e.createComponent(t.Provider,{get value(){return{scrollId:o.scrollId,behavior:o.behavior,transitionEnterName:o.transitionEnterName,elements:r,closeSymbol:i,onActivated:E,onDeactivated:L,insertElement:d,saveScroll:p,removeAliveElement:m,setCurrentComponentId:f,saveElScroll:S,resetElScroll:A,removeScrollEl:h}},get children(){return o.children}})},exports.AliveTransfer=function(l,s,c){var v,{behavior:d,elements:u,scrollId:m,closeSymbol:f,transitionEnterName:p,insertElement:E,saveScroll:L,setCurrentComponentId:S}=o.useContext(t);Reflect.has(u,s)||(S(s),o.createRoot((t=>{E({id:s,dispose:t,component:e.createComponent(l,{}),onDeactivated:null,onActivated:null,owner:o.getOwner,scroll:{top:0,left:0},children:Array.isArray(c)?c:null,domList:null})})));var h=e=>{var l;if(m&&a)if("cacheScroll"===e){var o="alwaysTop"===d?{top:0,left:0}:{top:a.scrollTop,left:a.scrollLeft};L(s,o)}else{var t=Date.now();if(t-n>200){const{top:e=0,left:o=0}=(null===(l=u[s])||void 0===l?void 0:l.scroll)||{};a.scrollTop=e,a.scrollLeft=o,n=t}}};if(p&&(null===(v=u[s])||void 0===v?void 0:v.owner)&&Date.now()-i>200){i=Date.now();let e=()=>{var e;return null===(e=u[s])||void 0===e?void 0:e.component},l=null==e?void 0:e();if("function"==typeof l&&(l=null==l?void 0:l()),l instanceof HTMLElement){var A=r[p]||p;l.classList.add(A);const e=()=>{l.classList.remove(A),l.removeEventListener("animationend",e)};l.addEventListener("animationend",e)}}return o.createEffect((()=>{var e,l,o;m&&!a&&(a=document.getElementById(m),!a&&console.error(`[solid-alive] scrollId: ${m} is null `)),null===(l=(e=u[s]).onActivated)||void 0===l||l.call(e),h("scrollTo"),null===(o=u[s].domList)||void 0===o||o.forEach(((e,l)=>{l.scrollTop=e.top,l.scrollLeft=e.left}))})),o.onCleanup((()=>{var e,l,o;S(f),null===(l=(e=u[s]).onDeactivated)||void 0===l||l.call(e),h("cacheScroll"),null===(o=u[s].domList)||void 0===o||o.forEach(((e,l,o)=>o.set(l,{top:l.scrollTop,left:l.scrollLeft})))})),o.runWithOwner(u[s].owner,(()=>u[s].component))},exports.useAlive=function(){var{onActivated:e,onDeactivated:l,removeAliveElement:r,saveElScroll:n,resetElScroll:i,removeScrollEl:a}=o.useContext(t);return{onActivated:e,onDeactivated:l,removeAliveElement:r,directiveSaveScroll:n,resetElScroll:i,removeScrollEl:a}};
+"use strict";var e=require("solid-js/web"),l=require("solid-js/store"),t=require("solid-js"),o=t.createContext({elements:{},scrollDom:{current:null},closeSymbol:Symbol("close"),insertElement:()=>{},onDeactivated:()=>{},onActivated:()=>{},removeAliveElement:()=>{},saveScroll:()=>{},setCurrentComponentId:()=>{},saveElScroll:()=>{},resetElScroll:()=>!0,removeScrollEl:()=>!0});var r={appear:"index-module_appear__MaHzX",_appear:"index-module__appear__7KeRW",toLeft:"index-module_toLeft__s1PDL",_toLeft:"index-module__toLeft__SD-Zp"};let n=0,c=0;exports.AliveProvider=function(r){var[n,c]=l.createStore(),s={current:null};let a=Symbol("close"),i=a,d=new Map,v=new Map,u=new Map;var m=e=>{let l=e.id,t=d.get(l),o=v.get(l),r=u.get(l);d.delete(l),v.delete(l),u.delete(l),c([l],Object.assign(Object.assign({},e),{onActivated:t,onDeactivated:o,domList:r}))},f=e=>{var l;if(Reflect.has(n,e)){var t=null===(l=n[e])||void 0===l?void 0:l.children;null==t||t.forEach((l=>l!==e&&f(l))),c((l=>{var t,o,r,n;return null===(o=(t=l[e]).onDeactivated)||void 0===o||o.call(t),l[e].component=null,null===(n=(r=l[e]).dispose)||void 0===n||n.call(r),l[e].dispose=null,l[e].onActivated=null,l[e].onDeactivated=null,l[e].scroll=null,l[e].id="",l[e].children=null,l[e].domList=null,l[e]=null,delete l[e],l}))}},p=e=>{if(null==e)for(const e of Object.values(n))f(e.id);else f(e)},E=e=>{i=e},L=(e,t)=>{Reflect.has(n,e)&&c(l.produce((l=>{l[e].scroll=Object.assign({},t)})))},S=e=>{i!==a&&d.set(i,e)},h=e=>{i!==a&&v.set(i,e)},A=(e,l)=>{var t,o;if(i!==a){var r=(null!==(t=u.get(i))&&void 0!==t?t:new Map([])).set(e,{top:0,left:0});u.set(i,r),null===(o=null==l?void 0:l())||void 0===o||o(e)}},D=e=>{var l;for(const t of Object.values(n))if(null===(l=t.domList)||void 0===l?void 0:l.has(e))return t.domList.delete(e),e.scrollTop=0,e.scrollLeft=0,!0;return!1},_=e=>{var l;for(const t of Object.values(n))if(null===(l=t.domList)||void 0===l?void 0:l.has(e))return t.domList.set(e,{top:0,left:0}),e.scrollTop=0,e.scrollLeft=0,!0;return!1};return t.createEffect((()=>{r.scrollId&&(s.current=document.getElementById(r.scrollId),!s.current&&console.error(`[solid-alive] scrollId: ${r.scrollId} is null `))})),e.createComponent(o.Provider,{get value(){return{scrollDom:s,behavior:r.behavior,transitionEnterName:r.transitionEnterName,elements:n,closeSymbol:a,onActivated:S,onDeactivated:h,insertElement:m,saveScroll:L,removeAliveElement:p,setCurrentComponentId:E,saveElScroll:A,resetElScroll:_,removeScrollEl:D}},get children(){return r.children}})},exports.AliveTransfer=function(l,s,a){var i,{behavior:d,elements:v,scrollDom:u,closeSymbol:m,transitionEnterName:f,insertElement:p,saveScroll:E,setCurrentComponentId:L}=t.useContext(o);Reflect.has(v,s)||(L(s),t.createRoot((t=>{p({id:s,dispose:t,component:e.createComponent(l,{}),onDeactivated:null,onActivated:null,scroll:{top:0,left:0},children:Array.isArray(a)?a:null,domList:null})})));var S=e=>{var l;if(u.current)if("cacheScroll"===e){var t="alwaysTop"===d?{top:0,left:0}:{top:u.current.scrollTop,left:u.current.scrollLeft};E(s,t)}else{var o=Date.now();if(o-n>200){const{top:e=0,left:t=0}=(null===(l=v[s])||void 0===l?void 0:l.scroll)||{};u.current.scrollTop=e,u.current.scrollLeft=t,n=o}}};if(f&&Date.now()-c>200){c=Date.now();let e=null===(i=v[s])||void 0===i?void 0:i.component;if("function"==typeof e&&(e=null==e?void 0:e()),e instanceof HTMLElement){var h=r[f]||f;e.classList.add(h);const l=()=>{e.classList.remove(h),e.removeEventListener("animationend",l)};e.addEventListener("animationend",l)}}return t.createEffect((()=>{var e,l,t;null===(l=(e=v[s]).onActivated)||void 0===l||l.call(e),S("scrollTo"),null===(t=v[s].domList)||void 0===t||t.forEach(((e,l)=>{l.scrollTop=e.top,l.scrollLeft=e.left}))})),t.onCleanup((()=>{var e,l,t;L(m),null===(l=(e=v[s]).onDeactivated)||void 0===l||l.call(e),S("cacheScroll"),null===(t=v[s].domList)||void 0===t||t.forEach(((e,l,t)=>t.set(l,{top:l.scrollTop,left:l.scrollLeft})))})),v[s].component},exports.useAlive=function(){var{onActivated:e,onDeactivated:l,removeAliveElement:r,saveElScroll:n,resetElScroll:c,removeScrollEl:s}=t.useContext(o);return{onActivated:e,onDeactivated:l,removeAliveElement:r,directiveSaveScroll:n,resetElScroll:c,removeScrollEl:s}};

package/dist/index.js

@@ -1 +1 @@
-import{createComponent as e}from"solid-js/web";import{createStore as l,produce as o}from"solid-js/store";import{createContext as t,useContext as n,createRoot as r,getOwner as i,createEffect as a,onCleanup as s,runWithOwner as c}from"solid-js";var d=t({elements:{},closeSymbol:Symbol("close"),insertElement:()=>{},onDeactivated:()=>{},onActivated:()=>{},removeAliveElement:()=>{},saveScroll:()=>{},setCurrentComponentId:()=>{},saveElScroll:()=>{},resetElScroll:()=>!0,removeScrollEl:()=>!0});function v(t){var[n,r]=l();let i=Symbol("close"),a=i,s=new Map,c=new Map,v=new Map;var u=e=>{let l=e.id,o=s.get(l),t=c.get(l),n=v.get(l);s.delete(l),c.delete(l),v.delete(l),r([l],Object.assign(Object.assign({},e),{onActivated:o,onDeactivated:t,domList:n}))},m=e=>{var l;if(Reflect.has(n,e)){var o=null===(l=n[e])||void 0===l?void 0:l.children;null==o||o.forEach((l=>l!==e&&m(l))),r((l=>{var o,t,n,r;return null===(t=(o=l[e]).onDeactivated)||void 0===t||t.call(o),l[e].component=null,null===(r=(n=l[e]).dispose)||void 0===r||r.call(n),l[e].dispose=null,l[e].owner=null,l[e].onActivated=null,l[e].onDeactivated=null,l[e].scroll=null,l[e].id="",l[e].children=null,l[e].domList=null,l[e]=null,delete l[e],l}))}},f=e=>{if(null==e)for(const e of Object.values(n))m(e.id);else m(e)},p=e=>{a=e},E=(e,l)=>{Reflect.has(n,e)&&r(o((o=>{o[e].scroll=Object.assign({},l)})))},L=e=>{a!==i&&s.set(a,e)},S=e=>{a!==i&&c.set(a,e)},h=(e,l)=>{var o,t;if(a!==i){var n=(null!==(o=v.get(a))&&void 0!==o?o:new Map([])).set(e,{top:0,left:0});v.set(a,n),null===(t=null==l?void 0:l())||void 0===t||t(e)}},_=e=>{var l;for(const o of Object.values(n))if(null===(l=o.domList)||void 0===l?void 0:l.has(e))return o.domList.delete(e),e.scrollTop=0,e.scrollLeft=0,!0;return!1},b=e=>{var l;for(const o of Object.values(n))if(null===(l=o.domList)||void 0===l?void 0:l.has(e))return o.domList.set(e,{top:0,left:0}),e.scrollTop=0,e.scrollLeft=0,!0;return!1};return e(d.Provider,{get value(){return{scrollId:t.scrollId,behavior:t.behavior,transitionEnterName:t.transitionEnterName,elements:n,closeSymbol:i,onActivated:L,onDeactivated:S,insertElement:u,saveScroll:E,removeAliveElement:f,setCurrentComponentId:p,saveElScroll:h,resetElScroll:b,removeScrollEl:_}},get children(){return t.children}})}var u={appear:"index-module_appear__MaHzX",_appear:"index-module__appear__7KeRW",toLeft:"index-module_toLeft__s1PDL",_toLeft:"index-module__toLeft__SD-Zp"};let m=0,f=0,p=null;function E(l,o,t){var v,{behavior:E,elements:L,scrollId:S,closeSymbol:h,transitionEnterName:_,insertElement:b,saveScroll:A,setCurrentComponentId:D}=n(d);Reflect.has(L,o)||(D(o),r((n=>{b({id:o,dispose:n,component:e(l,{}),onDeactivated:null,onActivated:null,owner:i,scroll:{top:0,left:0},children:Array.isArray(t)?t:null,domList:null})})));var w=e=>{var l;if(S&&p)if("cacheScroll"===e){var t="alwaysTop"===E?{top:0,left:0}:{top:p.scrollTop,left:p.scrollLeft};A(o,t)}else{var n=Date.now();if(n-m>200){const{top:e=0,left:t=0}=(null===(l=L[o])||void 0===l?void 0:l.scroll)||{};p.scrollTop=e,p.scrollLeft=t,m=n}}};if(_&&(null===(v=L[o])||void 0===v?void 0:v.owner)&&Date.now()-f>200){f=Date.now();let e=()=>{var e;return null===(e=L[o])||void 0===e?void 0:e.component},l=null==e?void 0:e();if("function"==typeof l&&(l=null==l?void 0:l()),l instanceof HTMLElement){var g=u[_]||_;l.classList.add(g);const e=()=>{l.classList.remove(g),l.removeEventListener("animationend",e)};l.addEventListener("animationend",e)}}return a((()=>{var e,l,t;S&&!p&&(p=document.getElementById(S),!p&&console.error(`[solid-alive] scrollId: ${S} is null `)),null===(l=(e=L[o]).onActivated)||void 0===l||l.call(e),w("scrollTo"),null===(t=L[o].domList)||void 0===t||t.forEach(((e,l)=>{l.scrollTop=e.top,l.scrollLeft=e.left}))})),s((()=>{var e,l,t;D(h),null===(l=(e=L[o]).onDeactivated)||void 0===l||l.call(e),w("cacheScroll"),null===(t=L[o].domList)||void 0===t||t.forEach(((e,l,o)=>o.set(l,{top:l.scrollTop,left:l.scrollLeft})))})),c(L[o].owner,(()=>L[o].component))}function L(){var{onActivated:e,onDeactivated:l,removeAliveElement:o,saveElScroll:t,resetElScroll:r,removeScrollEl:i}=n(d);return{onActivated:e,onDeactivated:l,removeAliveElement:o,directiveSaveScroll:t,resetElScroll:r,removeScrollEl:i}}export{v as AliveProvider,E as AliveTransfer,L as useAlive};
+import{createComponent as e}from"solid-js/web";import{createStore as l,produce as o}from"solid-js/store";import{createContext as t,createEffect as r,useContext as n,createRoot as i,onCleanup as c}from"solid-js";var s=t({elements:{},scrollDom:{current:null},closeSymbol:Symbol("close"),insertElement:()=>{},onDeactivated:()=>{},onActivated:()=>{},removeAliveElement:()=>{},saveScroll:()=>{},setCurrentComponentId:()=>{},saveElScroll:()=>{},resetElScroll:()=>!0,removeScrollEl:()=>!0});function a(t){var[n,i]=l(),c={current:null};let a=Symbol("close"),d=a,v=new Map,u=new Map,m=new Map;var f=e=>{let l=e.id,o=v.get(l),t=u.get(l),r=m.get(l);v.delete(l),u.delete(l),m.delete(l),i([l],Object.assign(Object.assign({},e),{onActivated:o,onDeactivated:t,domList:r}))},p=e=>{var l;if(Reflect.has(n,e)){var o=null===(l=n[e])||void 0===l?void 0:l.children;null==o||o.forEach((l=>l!==e&&p(l))),i((l=>{var o,t,r,n;return null===(t=(o=l[e]).onDeactivated)||void 0===t||t.call(o),l[e].component=null,null===(n=(r=l[e]).dispose)||void 0===n||n.call(r),l[e].dispose=null,l[e].onActivated=null,l[e].onDeactivated=null,l[e].scroll=null,l[e].id="",l[e].children=null,l[e].domList=null,l[e]=null,delete l[e],l}))}},E=e=>{if(null==e)for(const e of Object.values(n))p(e.id);else p(e)},L=e=>{d=e},S=(e,l)=>{Reflect.has(n,e)&&i(o((o=>{o[e].scroll=Object.assign({},l)})))},h=e=>{d!==a&&v.set(d,e)},D=e=>{d!==a&&u.set(d,e)},_=(e,l)=>{var o,t;if(d!==a){var r=(null!==(o=m.get(d))&&void 0!==o?o:new Map([])).set(e,{top:0,left:0});m.set(d,r),null===(t=null==l?void 0:l())||void 0===t||t(e)}},b=e=>{var l;for(const o of Object.values(n))if(null===(l=o.domList)||void 0===l?void 0:l.has(e))return o.domList.delete(e),e.scrollTop=0,e.scrollLeft=0,!0;return!1},A=e=>{var l;for(const o of Object.values(n))if(null===(l=o.domList)||void 0===l?void 0:l.has(e))return o.domList.set(e,{top:0,left:0}),e.scrollTop=0,e.scrollLeft=0,!0;return!1};return r((()=>{t.scrollId&&(c.current=document.getElementById(t.scrollId),!c.current&&console.error(`[solid-alive] scrollId: ${t.scrollId} is null `))})),e(s.Provider,{get value(){return{scrollDom:c,behavior:t.behavior,transitionEnterName:t.transitionEnterName,elements:n,closeSymbol:a,onActivated:h,onDeactivated:D,insertElement:f,saveScroll:S,removeAliveElement:E,setCurrentComponentId:L,saveElScroll:_,resetElScroll:A,removeScrollEl:b}},get children(){return t.children}})}var d={appear:"index-module_appear__MaHzX",_appear:"index-module__appear__7KeRW",toLeft:"index-module_toLeft__s1PDL",_toLeft:"index-module__toLeft__SD-Zp"};let v=0,u=0;function m(l,o,t){var a,{behavior:m,elements:f,scrollDom:p,closeSymbol:E,transitionEnterName:L,insertElement:S,saveScroll:h,setCurrentComponentId:D}=n(s);Reflect.has(f,o)||(D(o),i((r=>{S({id:o,dispose:r,component:e(l,{}),onDeactivated:null,onActivated:null,scroll:{top:0,left:0},children:Array.isArray(t)?t:null,domList:null})})));var _=e=>{var l;if(p.current)if("cacheScroll"===e){var t="alwaysTop"===m?{top:0,left:0}:{top:p.current.scrollTop,left:p.current.scrollLeft};h(o,t)}else{var r=Date.now();if(r-v>200){const{top:e=0,left:t=0}=(null===(l=f[o])||void 0===l?void 0:l.scroll)||{};p.current.scrollTop=e,p.current.scrollLeft=t,v=r}}};if(L&&Date.now()-u>200){u=Date.now();let e=null===(a=f[o])||void 0===a?void 0:a.component;if("function"==typeof e&&(e=null==e?void 0:e()),e instanceof HTMLElement){var b=d[L]||L;e.classList.add(b);const l=()=>{e.classList.remove(b),e.removeEventListener("animationend",l)};e.addEventListener("animationend",l)}}return r((()=>{var e,l,t;null===(l=(e=f[o]).onActivated)||void 0===l||l.call(e),_("scrollTo"),null===(t=f[o].domList)||void 0===t||t.forEach(((e,l)=>{l.scrollTop=e.top,l.scrollLeft=e.left}))})),c((()=>{var e,l,t;D(E),null===(l=(e=f[o]).onDeactivated)||void 0===l||l.call(e),_("cacheScroll"),null===(t=f[o].domList)||void 0===t||t.forEach(((e,l,o)=>o.set(l,{top:l.scrollTop,left:l.scrollLeft})))})),f[o].component}function f(){var{onActivated:e,onDeactivated:l,removeAliveElement:o,saveElScroll:t,resetElScroll:r,removeScrollEl:i}=n(s);return{onActivated:e,onDeactivated:l,removeAliveElement:o,directiveSaveScroll:t,resetElScroll:r,removeScrollEl:i}}export{a as AliveProvider,m as AliveTransfer,f as useAlive};

package/dist/types/AliveProvider.d.ts

@@ -4,6 +4,6 @@ import { ProveiderProps } from './default';
  * @param children jsx.element
  * @param { string } [scrollId] id,如 'root' 会在切换组件时的动作,默认saveScrollTop
  * @param { 'alwaysTop'|'saveScroll' } [behavior] dom元素滚动条会如何保持
- * @param { 'appear'|'toLeft'  } [transitionEnterName] 路由切换动画, 可以自己加
+ * @param { 'appear'|'toLeft' } [transitionEnterName] 路由切换动画, 可以自己加
  */
 export default function AliveProvider(props: ProveiderProps): import("solid-js").JSX.Element;

package/dist/types/AliveTransfer.d.ts

@@ -1,7 +1,7 @@
 import { JSX } from 'solid-js';
 /**
  * @description Alive 组件用的 转换函数
- * @param { string } Componet,
+ * @param { ()=> JSX.Element } Componet,
  * @param { string } id  string,自己的id 值,一定要唯一
  * @param { Array<string> } [children]  [string,...], 子组件的 id值 可不传，这样默认销毁时不会去干掉子组件，
  */

package/dist/types/default.d.ts

@@ -21,7 +21,6 @@ export interface ProveiderProps extends pub {
 export interface NodeInfo {
   id: string
   component: JSX.Element
-  owner: Owner | null
   scroll: {top:number,left:number} | null
   domList: Map<Element, {top:number,left:number  }> | null
   children?: Array<string> | null
@@ -36,6 +35,7 @@ export interface StoreProps {
 }
 
 export interface ContextProps extends pub {
+  scrollDom:{current:Element | null},
   elements: StoreProps
   closeSymbol: symbol
   insertElement: (d: NodeInfo) => void

package/package.json

@@ -1,6 +1,7 @@
 {
   "name": "solid-alive",
-  "version": "0.1.0",
+  "version": "0.1.2",
+  "author": "1iuxs",
   "description": "solid-alive",
   "type": "module",
   "main": "dist/index.cjs",
@@ -27,9 +28,8 @@
   ],
   "repository": {
     "type": "git",
-    "url": "https://gitee.com/iuxs/solid-alive"
+    "url": "https://github.com/iuxs/solid-alive"
   },
-  "author": "iuxs",
   "license": "ISC",
   "dependencies": {
     "solid-js": "^1.8.16"

package/readme.md

@@ -1,16 +1,21 @@
-# solid-alive
+## solid-alive
 
 ### 安装(install)
  - pnpm add solid-alive ／ npm i solid-alive / yarn add solid-alive
 ### 描述(describe)
-- 用于 solid 组件缓存,只测试过2级路由缓存
-- 在 useAlive 中有 onActivated, onDeactivated,removeAliveElement 三个函数使用
+- 用于 solid 组件缓存,只测试过2级路由缓存, 有过渡动画, 可缓存组件内的滚动条
+- AliveProvider 
+  - scrollId : 想滚动的元素id, 我用的getElementById
+  - behavior : 想 scrollId 的滚动条是 alwaysTop / savaScroll
+  - transitionEnterName : 'appear'/ 'toLeft'/...., Customizable  路由切换 的过渡动画, 但要在 App中引入 样式, import 'solid-alive/dist/styles/style.css', 自定义的css要用 @keyframes 来定义动画
+- 在 useAlive 
   - removeAliveElement: 函数, 可传一个参数, 不传就删除所有缓存 :
     removeAliveElement('/home')
   - onActivated / onDeactivated: 函数,只能传一个函数,多次调用只有最一个会调用.
     onActivated(()=> console.log('actived'))
-  - directiveSaveScroll  保存滚动条指令, 不过能不用就不用, 但组件不能使用,只能标签
-- 可记住指定元素, 但要在 AliveProvider 中加 saveScrollElement 参数, 最好唯一. 但组件内部的滚动条问题 有个指令函数,
+  - directiveSaveScroll:  保存滚动条指令, 不过能不用就不用, 但组件不能使用,只能标签!!!ref会拿不到dom
+  - resetElScroll :  重置元素的滚动条
+  - removeScrollEl :  删除元素在alive中保存的dom
 - 子父 缓存/删除 问题
   -  如果某组件下有子组件,在父的 AliveTransfer中, 
     第三个参数,为对象 写上子组件的唯一id: {children:['/childrenId','asf',...]}
@@ -24,6 +29,8 @@
 import { render } from 'solid-js/web'
 import App from './App'
 import { AliveProvider } from  'solid-alive'
+import 'solid-alive/dist/styles/style.css' // transition css, 
+
 const root = document.getElementById('root')
 
 render(() => 
@@ -98,6 +105,7 @@ export default function Single() {
     resetElScroll, 
   } = useAlive()
 
+  let divRef: Element | undefined = undefined
   const click = () => {
     removeAliveElement('/about') // delete '/about'; 删除 /about
     // removeAliveElement() // delete all alive element; 会删除所有缓存的组件