solid-alive 0.3.1 → 0.3.3

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/index.js CHANGED
@@ -1 +1 @@
1
- import{createComponent as e}from"solid-js/web";import{createContext as t,useContext as n,createRoot as r,getOwner as i,onCleanup as o,runWithOwner as l,createEffect as s,untrack as d}from"solid-js";import{produce as u,createStore as v}from"solid-js/store";const a=Symbol("currentId"),c=Symbol("setActiveCb");var m=t({elements:{},setElements:()=>{},setActiveCb:()=>{},aliveIds:()=>{}});const f=t({[a]:void 0,[c]:()=>{}});function A(t,s,d){return function(v){var A,y,h=n(m);return(null===(A=h.aliveIds())||void 0===A?void 0:A.includes(s))?(h.elements[s]?null===(y=h.elements[s].onActivated)||void 0===y||y.forEach((e=>e())):(h.setElements({[s]:{id:s,subsets:Array.isArray(d)?d:null}}),r((n=>{h.setElements(u((r=>{r[s].dispose=n,r[s].id=s,r[s].owner=i(),r[s].element=e(f.Provider,{get value(){return{[a]:s,[c]:h.setActiveCb}},get children(){return t(v)}})})))}))),o((()=>{var e;null===(e=h.elements[s].onDeactivated)||void 0===e||e.forEach((e=>e()))})),h.elements[s].owner&&l(h.elements[s].owner,(()=>h.elements[s].element))):t(v)}}function y(t){const[n,r]=v(),i=e=>{var t,o,l;if(Array.isArray(e))for(var s of e)i(null===(t=n[s])||void 0===t?void 0:t.subsets),null===(l=null===(o=n[s])||void 0===o?void 0:o.dispose)||void 0===l||l.call(o),r({[s]:void 0})};return s((e=>{var n=Array.isArray(t.include)?t.include:[];if(e.length>n.length){var r=new Set(n);i(e.filter((e=>!r.has(e))))}return n}),Array.isArray(t.include)?t.include:[]),e(m.Provider,{value:{elements:n,setElements:r,setActiveCb:(e,t,n,i)=>{r(u((r=>{r[e][t]?r[e][t][i](n):"add"===i&&(r[e][t]=new Set([n]))})))},aliveIds:()=>t.include},get children(){return t.children}})}function h(e,t){d((()=>{var r=n(f),i=r[a];i&&(r[c](i,e,t,"add"),"onActivated"===e&&s((()=>{!function(e){"undefined"!=typeof Promise&&"function"==typeof Promise.prototype.then?Promise.resolve().then(e):setTimeout(e)}(t)})),o((()=>{r[c](i,e,t,"delete"),t=null})))}))}function p(e){h("onActivated",e)}function b(e){h("onDeactivated",e)}export{y as AliveProvider,A as aliveTransfer,p as onActivated,b as onDeactivated};
1
+ import{createComponent as e}from"solid-js/web";import{createContext as n,useContext as t,createRoot as r,createEffect as i,onCleanup as o,untrack as l}from"solid-js";import{produce as s,createStore as a}from"solid-js/store";const d=Symbol("currentId"),v=Symbol("setActiveCb"),u=Symbol("parentId");var c=n({elements:{},setElements:()=>{},setActiveCb:()=>{},aliveIds:()=>{},info:{frozen:!1},transitionEnterName:()=>{}});const f=n({[d]:void 0,[v]:()=>{}});var m=(n,t,r,i)=>e(f.Provider,{value:{[d]:i,[v]:r,[u]:t},get children(){return n()}}),p=e=>{for(;"function"==typeof e;)e=e();return e},h=!1;function y(e,n,l){return function(a){var v,u,y,A,b=t(c),E=t(f)[d],I=b.transitionEnterName();if(!(null===(v=b.aliveIds())||void 0===v?void 0:v.includes(n)))return m((()=>e(a)));if(E&&(null===(u=b.elements[n])||void 0===u?void 0:u.parentId)&&b.elements[n].parentId!==E)return null;b.elements[n]?b.info.frozen?(null===(y=b.elements[n].subsets)||void 0===y?void 0:y.some((e=>b.elements[e])))||(b.info.frozen=!1):null===(A=b.elements[n].onActivated)||void 0===A||A.forEach((e=>e())):(b.setElements({[n]:{id:n,subsets:Array.isArray(l)?l:null}}),r((t=>{b.setElements(s((r=>{var i;r[n].dispose=t,r[n].parentId=null===(i=Object.values(b.elements).find((e=>{var t;return null===(t=e.subsets)||void 0===t?void 0:t.includes(n)})))||void 0===i?void 0:i.id,r[n].element=m((()=>e(a)),r[n].parentId,b.setActiveCb,n)})))})));var g=e=>{if(e instanceof HTMLElement&&!h){h=!0,e.classList.add(I);var n=()=>{e.removeEventListener("animationend",n),e.classList.remove(I),h=!1};e.addEventListener("animationend",n)}};return I&&!b.info.frozen&&i((()=>{if(!h){var e=n;do{b.elements[e].parentId||g(p(b.elements[e].element)),e=b.elements[e].parentId}while(e)}})),o((()=>{var e,t;b.info.frozen||null===(t=null===(e=b.elements[n])||void 0===e?void 0:e.onDeactivated)||void 0===t||t.forEach((e=>e()))})),b.elements[n].element}}function A(n){const[t,r]=a();return i((e=>{var i=Array.isArray(n.include)?n.include:[];if(e.length>i.length){var o=new Set(i);(e=>{var n,i;if(Array.isArray(e))for(var o of e)null===(i=null===(n=t[o])||void 0===n?void 0:n.dispose)||void 0===i||i.call(n),r({[o]:void 0})})(e.filter((e=>!o.has(e))))}return i}),Array.isArray(n.include)?n.include:[]),e(c.Provider,{value:{info:{frozen:!1},elements:t,setElements:r,setActiveCb:(e,n,t,i)=>{r(s((r=>{r[e][n]?r[e][n][i](t):"add"===i&&(r[e][n]=new Set([t]))})))},aliveIds:()=>n.include,transitionEnterName:()=>n.transitionEnterName},get children(){return n.children}})}const b=(()=>{let e=[],n=!1,t=()=>{},r=/iPad|iPhone|iPod/.test(navigator.userAgent)&&!window.MSStream,i=()=>{n=!1;var t=e.slice(0);e.length=0;for(let e=0;e<t.length;e++)t[e]()};if("undefined"!=typeof Promise&&"function"==typeof Promise.prototype.then){const e=Promise.resolve();t=()=>{e.then(i),r&&setTimeout((()=>{}))}}else if("undefined"!=typeof MutationObserver){let e=1;const n=new MutationObserver(i),r=document.createTextNode(String(e));n.observe(r,{characterData:!0}),t=()=>{e=(e+1)%2,r.data=String(e)}}else t=()=>{setTimeout(i,0)};return r=>{e.push(r),n||(n=!0,t())}})();function E(e,n){l((()=>{var r,i=t(f),l=i[d];l&&(null===(r=i[v])||void 0===r||r.call(i,l,e,n,"add"),"onActivated"===e&&b(n),o((()=>{var t;null===(t=i[v])||void 0===t||t.call(i,l,e,n,"delete"),n=null})))}))}function I(e){E("onActivated",e)}function g(e){E("onDeactivated",e)}function S(){var e=t(c).info;return()=>e.frozen=!0}export{A as AliveProvider,y as aliveTransfer,b as nextTick,I as onActivated,g as onDeactivated,S as useAliveFrozen};
@@ -1,2 +1,8 @@
1
1
  import { ProveiderProps } from "./types";
2
+ /**
3
+ * @description Alive
4
+ * @param children jsx.element
5
+ * @param {Arrya<string> | null} [include] 哪些路由要缓存, 默认不缓存, ['/','/about',...]
6
+ * @param {string} [transitionEnterName] 动画名称 transitionEnterName="appear"
7
+ */
2
8
  export default function AliveProvider(props: ProveiderProps): import("solid-js").JSX.Element;
@@ -1,2 +1,3 @@
1
1
  export declare function onActivated(cb: () => void): void;
2
2
  export declare function onDeactivated(cb: () => void): void;
3
+ export declare function useAliveFrozen(): () => boolean;
@@ -1,2 +1,8 @@
1
1
  import { JSX } from "solid-js";
2
- export default function aliveTransfer(Component: <T>(props: T) => JSX.Element, id: string, subsets?: Array<string>): <T>(props: T) => any;
2
+ /**
3
+ * @description Alive 组件用的 转换函数; aliveTransfer(Comp, ‘/home’)
4
+ * @param { ()=> JSX.Element } Component () => JSX.Element
5
+ * @param { string } id string,自己的id 值,一定要唯一
6
+ * @param { Array<string> } [subsets] [string,...], 子组件的 id值 可不传
7
+ */
8
+ export default function aliveTransfer(Component: <T>(props: T) => JSX.Element, id: string, subsets?: Array<string> | null): <T>(props: T) => JSX.Element;
@@ -1,9 +1,11 @@
1
1
  import { Context } from "./types";
2
2
  export declare const CURRENTID: unique symbol;
3
3
  export declare const SETACTIVECB: unique symbol;
4
+ export declare const PARENTID: unique symbol;
4
5
  declare const _default: import("solid-js").Context<Context>;
5
6
  export default _default;
6
7
  export declare const ChildContext: import("solid-js").Context<{
7
8
  [CURRENTID]: string | undefined;
8
- [SETACTIVECB]: Context["setActiveCb"];
9
+ [SETACTIVECB]?: Context["setActiveCb"];
10
+ [PARENTID]?: string;
9
11
  }>;
@@ -1,4 +1,5 @@
1
1
  import aliveTransfer from "./aliveTransfer";
2
2
  import AliveProvider from "./AliveProvider";
3
- import { onActivated, onDeactivated } from "./active";
4
- export { aliveTransfer, AliveProvider, onActivated, onDeactivated };
3
+ import { onActivated, onDeactivated, useAliveFrozen } from "./active";
4
+ import nextTick from "./nextTick";
5
+ export { aliveTransfer, AliveProvider, onActivated, onDeactivated, useAliveFrozen, nextTick };
@@ -1 +1,2 @@
1
- export declare function nextTick(cb: () => void): void;
1
+ declare const nextTick: (cb: () => void) => void;
2
+ export default nextTick;
@@ -1,4 +1,4 @@
1
- import { Owner, JSX } from "solid-js"
1
+ import { Owner, JSX, Accessor } from "solid-js"
2
2
  import { SetStoreFunction } from "solid-js/store"
3
3
 
4
4
  export type EmitType = keyof Emit
@@ -14,21 +14,34 @@ export interface Emit {
14
14
 
15
15
  export interface ProveiderProps {
16
16
  children: JSX.Element
17
- include?: Array<string>
17
+ include?: Array<string>
18
+ transitionEnterName?: string
19
+ }
20
+
21
+ export interface Info {
22
+ frozen: boolean
18
23
  }
19
24
 
20
25
  export interface Element {
21
26
  id: string
22
27
  element: JSX.Element
28
+ subsets?:Array<string> | null
23
29
  dispose?: () => void
24
30
  onActivated?: Set<() => void>
25
31
  onDeactivated?: Set<() => void>
26
- subsets?: Array<string>
32
+ parentId?: string
27
33
  owner?: Owner | null
28
34
  }
29
35
  export interface Context {
30
36
  elements: Record<string, Element>
31
37
  setElements: SetStoreFunction<{}>
32
- aliveIds: ()=> Array<string> | undefined
33
- setActiveCb: (id:string,t: Activate, cb: () => void, t1: 'add'| 'delete') => void
38
+ aliveIds: () => Array<string> | undefined
39
+ setActiveCb: (
40
+ id: string,
41
+ t: Activate,
42
+ cb: () => void,
43
+ t1: "add" | "delete"
44
+ ) => void
45
+ info: { frozen: boolean }
46
+ transitionEnterName: () => string | void
34
47
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "solid-alive",
3
- "version": "0.3.1",
3
+ "version": "0.3.3",
4
4
  "author": "1iuxs",
5
5
  "description": "solid-alive",
6
6
  "type": "module",
@@ -12,9 +12,7 @@
12
12
  "test": "echo \"Error: no test specified\" && exit 1"
13
13
  },
14
14
  "keywords": [
15
- "keep-alive",
16
15
  "solid-js",
17
- "keepalive",
18
16
  "cache",
19
17
  "solid-alive",
20
18
  "solid-keep-alive",
@@ -32,21 +30,21 @@
32
30
  },
33
31
  "license": "ISC",
34
32
  "dependencies": {
35
- "solid-js": "^1.8.17"
33
+ "solid-js": "^1.9.4"
36
34
  },
37
35
  "devDependencies": {
38
36
  "@rollup/plugin-json": "^6.1.0",
39
- "@rollup/plugin-node-resolve": "^15.2.3",
37
+ "@rollup/plugin-node-resolve": "^15.3.1",
40
38
  "@rollup/plugin-typescript": "^11.1.6",
41
39
  "@types/css-modules": "^1.0.5",
42
- "autoprefixer": "^10.4.19",
43
- "rollup": "^4.18.0",
40
+ "autoprefixer": "^10.4.20",
41
+ "rollup": "^4.30.1",
44
42
  "rollup-plugin-cleanup": "^3.2.1",
45
43
  "rollup-plugin-postcss": "^4.0.2",
46
44
  "rollup-plugin-serve": "^1.1.1",
47
45
  "rollup-plugin-terser": "^7.0.2",
48
46
  "rollup-plugin-typescript2": "^0.36.0",
49
47
  "rollup-preset-solid": "^2.0.1",
50
- "typescript": "^5.4.5"
48
+ "typescript": "^5.7.3"
51
49
  }
52
50
  }
package/readme.md CHANGED
@@ -5,19 +5,14 @@
5
5
  ### 描述(describe)
6
6
  - 用于 solid 组件缓存,只测试过2级路由缓存
7
7
  - AliveProvider
8
- - include : 数组, 不传默认缓存所有, ['/','/about'], 当数据变少时, 会自动去删除少的数据缓存
9
- - AliveComponent 不要在 有缓存 的组件中使用
8
+ - include : 数组, ['/','/about'], 当数据变少时, 会自动去删除少的数据缓存
10
9
  - 在 useAlive
11
- - removeAliveElements: 函数, 可传一个参数, 不传就删除所有缓存 :
12
- removeAliveElements(['/home'])
13
10
  - onActivated
14
11
  - onDeactivated
15
- - aliveForzen: 暂时不响应 路由数据变化, aliveForzen()
16
12
 
17
13
  - 子父 缓存/删除 问题
18
14
  - 如果某组件下有子组件,在父的 aliveTransfer中,
19
15
  第三个参数,为对象 写上子组件的唯一id: {children:['/childrenId','asf',...]}
20
- - 使用见下图, 也可用 removeAliveElements 删除
21
16
 
22
17
 
23
18
 
@@ -30,8 +25,6 @@ import { AliveProvider } from 'solid-alive'
30
25
 
31
26
  const root = document.getElementById('root')
32
27
 
33
- // include, 不传 默认缓存所有: include={['/','/about']}
34
- // When the data decreases, the reduced cache data will be automatically deleted
35
28
  render(() =>
36
29
  <AliveProvider include={[]}>
37
30
  <App />
@@ -93,10 +86,6 @@ import { onActivated,onDeactivated,useAlive, AliveComponent } from "solid-alive
93
86
  export default function Single() {
94
87
  const { removeAliveElements,aliveFrozen } = useAlive()
95
88
 
96
- const click = () => {
97
- removeAliveElements(['/about']) // delete '/about'; 删除 /about
98
- // removeAliveElements() // delete all alive element; 会删除所有缓存的组件
99
- }
100
89
 
101
90
  //todo call 这个会被调用
102
91
  onActivated(()=>{
@@ -114,10 +103,6 @@ export default function Single() {
114
103
  return (
115
104
  <div>
116
105
  <h2>Single</h2>
117
- { /** 这个 AliveComponent 最好是在 未缓存的组件 中使用, 不然生命周期不同步 */ }
118
- <AliveComponent id={'home1'}>
119
- <Home />
120
- </AliveComponent>
121
106
  <input type="text" style={{ border: '2px solid red' }} />
122
107
  </div>
123
108
  )
@@ -156,20 +141,6 @@ const App: Component = () => {
156
141
  const { aliveFrozen } = useAlive()
157
142
 
158
143
  const [data, setData] = createStore<MenuData[]>([])
159
- const a: MenuData = {
160
- id: 2,
161
- text: 'ABOUT',
162
- path: '/about',
163
- realPath: '/About/index.tsx',
164
- parentId: null,
165
- }
166
- const addRoute =()=>{
167
- aliveFrozen() // 暂时不响应下面数据变化
168
- setData(d => {
169
- return [...d, a]
170
- })
171
- }
172
-
173
144
  return (
174
145
  <Router>
175
146
  <Route component={Client}>