@stackflow/react
Advanced tools
Comparing version 0.1.1-alpha.164 to 0.1.1-alpha.172
import React from "react"; | ||
import { Activities } from "../stackflow"; | ||
import { BaseActivities } from "../BaseActivities"; | ||
export interface CoreProviderProps { | ||
activities: Activities; | ||
activities: BaseActivities; | ||
transitionDuration: number; | ||
@@ -6,0 +6,0 @@ initialActivity?: (args: { |
@@ -1,2 +0,533 @@ | ||
var St=Object.create;var b=Object.defineProperty,Rt=Object.defineProperties,ht=Object.getOwnPropertyDescriptor,Dt=Object.getOwnPropertyDescriptors,Tt=Object.getOwnPropertyNames,j=Object.getOwnPropertySymbols,wt=Object.getPrototypeOf,$=Object.prototype.hasOwnProperty,bt=Object.prototype.propertyIsEnumerable;var z=(t,e,o)=>e in t?b(t,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[e]=o,v=(t,e)=>{for(var o in e||(e={}))$.call(e,o)&&z(t,o,e[o]);if(j)for(var o of j(e))bt.call(e,o)&&z(t,o,e[o]);return t},S=(t,e)=>Rt(t,Dt(e));var Ot=(t,e)=>{for(var o in e)b(t,o,{get:e[o],enumerable:!0})},J=(t,e,o,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of Tt(e))!$.call(t,n)&&n!==o&&b(t,n,{get:()=>e[n],enumerable:!(i=ht(e,n))||i.enumerable});return t};var x=(t,e,o)=>(o=t!=null?St(wt(t)):{},J(e||!t||!t.__esModule?b(o,"default",{value:t,enumerable:!0}):o,t)),It=t=>J(b({},"__esModule",{value:!0}),t);var _t={};Ot(_t,{stackflow:()=>Lt,useActions:()=>Wt,useActivity:()=>Nt,useActivityParams:()=>Vt,usePlugins:()=>d,useStack:()=>Mt});module.exports=It(_t);var Q=require("react");var K=require("react"),R=(0,K.createContext)(null);var Nt=()=>(0,Q.useContext)(R);var X=require("react");function Vt(){return(0,X.useContext)(R).params}var Z=require("react");var Y=require("react"),I=(0,Y.createContext)(null);function d(){return(0,Z.useContext)(I)}var et=require("react");var tt=require("react"),N=(0,tt.createContext)(null);var Mt=()=>(0,et.useContext)(N);var A=x(require("react"));var ot=x(require("react"));var rt=({children:t,value:e})=>ot.default.createElement(R.Provider,{value:e},t);var it=require("@stackflow/core");function O(){return(0,it.id)()}var nt=require("react"),V=(0,nt.createContext)({});var at=x(require("react"));var ct=({children:t,value:e})=>at.default.createElement(V.Provider,{value:e},t);var st=x(require("react"));function M(){return st.default.useContext(V)}var C=require("@stackflow/core"),u=x(require("react")),vt=x(require("react-fast-compare"));var mt=x(require("react"));var pt=({children:t,value:e})=>mt.default.createElement(I.Provider,{value:e},t);var ft=require("react"),F=(0,ft.createContext)(null);var ut=require("react"),H=(0,ut.createContext)(null);var Ft=1e3,Ht=Ft/60,xt=({transitionDuration:t,initialActivity:e,activities:o,children:i})=>{let n=d(),m=M(),a=(0,u.useMemo)(()=>{let P=new Date().getTime()-t,k=n.reduce((G,L)=>{var _,B;return(B=(_=L.initialPushedEvent)==null?void 0:_.call(L))!=null?B:G},null),l=e?(0,C.makeEvent)("Pushed",{activityId:O(),activityName:e({context:m}),params:{},eventDate:P}):null;k&&l&&console.warn(`Stackflow - Some plugin overrides an "initialActivity" option. The "initialActivity" option you set to "${l.activityName}" in the "stackflow" is ignored.`);let w=k!=null?k:l,Et=Object.keys(o).map(G=>(0,C.makeEvent)("ActivityRegistered",{activityName:G,eventDate:P})),W=[(0,C.makeEvent)("Initialized",{transitionDuration:t,eventDate:P}),...Et];return w&&W.push(w),W},[]),s=(0,u.useMemo)(()=>(0,C.aggregate)(a,new Date().getTime()),[]),[r,c]=(0,u.useState)(()=>s),f=(0,u.useRef)(a),p=(0,u.useRef)(s),g=(0,u.useCallback)(()=>p.current,[p]),T=(0,u.useCallback)((P,k)=>{let l=(0,C.makeEvent)(P,k),w=[...f.current,l];f.current=w,c((0,C.aggregate)(w,new Date().getTime()))},[f,c]);return(0,u.useEffect)(()=>{let P=setInterval(()=>{let k=f.current,l=(0,C.aggregate)(k,new Date().getTime());(0,vt.default)(r,l)||(c(l),p.current=l),l.globalTransitionState==="idle"&&clearInterval(P)},Ht);return()=>{clearInterval(P)}},[f,r,c]),u.default.createElement(H.Provider,{value:r},u.default.createElement(F.Provider,{value:(0,u.useMemo)(()=>({getState:g,dispatchEvent:T}),[g,T])},i))};var y=x(require("react"));var h=()=>{let t=d(),e=M(),{dispatchEvent:o,getState:i}=y.default.useContext(F),n=(0,y.useCallback)(r=>{let c=!1,f=()=>{c=!0};return t.forEach(p=>{var g,T,P;switch(r){case"PUSHED":(g=p.onBeforePush)==null||g.call(p,{actions:{dispatchEvent:o,getState:i,preventDefault:f}});break;case"REPLACED":(T=p.onBeforeReplace)==null||T.call(p,{actions:{dispatchEvent:o,getState:i,preventDefault:f}});break;case"POPPED":(P=p.onBeforePop)==null||P.call(p,{actions:{dispatchEvent:o,getState:i,preventDefault:f}});break;default:break}}),{isPrevented:c}},[t,o,i,e]),m=(0,y.useCallback)(({activityId:r,activityName:c,params:f})=>{let{isPrevented:p}=n("PUSHED");p||o("Pushed",{activityId:r,activityName:c,params:f})},[o]),a=(0,y.useCallback)(({activityId:r,activityName:c,params:f})=>{let{isPrevented:p}=n("REPLACED");p||o("Replaced",{activityId:r,activityName:c,params:f})},[o]),s=(0,y.useCallback)(()=>{let{isPrevented:r}=n("POPPED");r||o("Popped",{})},[o]);return(0,y.useMemo)(()=>({dispatchEvent:o,getState:i,push:m,replace:a,pop:s}),[o,i,m,a,s])};var Pt=x(require("react"));var D=()=>Pt.default.useContext(H);var dt=require("@stackflow/core"),E=require("react");var Ut=()=>{let t=d(),e=D(),o=h(),i=(0,E.useCallback)(a=>{t.forEach(s=>{var r;(r=s.onInit)==null||r.call(s,a)})},[]),n=(0,E.useCallback)(({actions:a,effect:s})=>{switch(s._TAG){case"PUSHED":{t.forEach(r=>{var c;return(c=r.onPushed)==null?void 0:c.call(r,{actions:a,effect:s})});break}case"POPPED":{t.forEach(r=>{var c;return(c=r.onPopped)==null?void 0:c.call(r,{actions:a,effect:s})});break}case"REPLACED":{t.forEach(r=>{var c;return(c=r.onReplaced)==null?void 0:c.call(r,{actions:a,effect:s})});break}case"%SOMETHING_CHANGED%":{t.forEach(r=>{var c;return(c=r.onChanged)==null?void 0:c.call(r,{actions:a,effect:s})});break}default:break}},[]);(0,E.useEffect)(()=>{i==null||i({actions:{dispatchEvent:o.dispatchEvent,getState:o.getState}})},[]);let m=(0,E.useRef)(e);return(0,E.useEffect)(()=>{let a=m.current;(a?(0,dt.produceEffects)(a,e):[]).forEach(r=>{n({actions:{dispatchEvent:o.dispatchEvent,getState:o.getState},effect:r})}),m.current=v({},e)},[e]),null},lt=Ut;var q=x(require("react"));var U=x(require("react"));var Ct=x(require("react"));var yt=({children:t,value:e})=>Ct.default.createElement(N.Provider,{value:e},t);var qt=({activities:t,plugin:e})=>{let o=D(),i=d();return e.render({stack:S(v({},o),{render(n){let m=v(v({},o),n);return{activities:m.activities.map(a=>S(v({},a),{key:a.id,render(s){let r=t[a.name],c=U.default.createElement(r,v({},a.params));return i.forEach(f=>{var p,g;c=(g=(p=f.wrapActivity)==null?void 0:p.call(f,{activity:S(v({},a),{render:()=>c})}))!=null?g:c}),U.default.createElement(yt,{value:m},U.default.createElement(rt,{key:a.id,value:v(v({},a),s)},c))}}))}}})})},At=qt;var Gt=({activities:t})=>{let e=D(),o=d(),i=q.default.createElement(q.default.Fragment,null,o.filter(n=>!!n.render).map(n=>q.default.createElement(At,{activities:t,key:n.key,plugin:n})));return o.forEach(n=>{var m,a;i=(a=(m=n.wrapStack)==null?void 0:m.call(n,{stack:S(v({},e),{render(){return i}})}))!=null?a:i}),i},gt=Gt;function Lt(t){return{Stack:i=>{var m;let n=(0,A.useMemo)(()=>{var a;return((a=t.plugins)!=null?a:[]).reduce((s,r)=>[...s,...Array.isArray(r)?r:[r]],[]).map(s=>s({context:i.context}))},[]);return A.default.createElement(ct,{value:(m=i.context)!=null?m:{}},A.default.createElement(pt,{value:n},A.default.createElement(xt,{activities:t.activities,initialActivity:t.initialActivity,transitionDuration:t.transitionDuration},A.default.createElement(gt,{activities:t.activities}),A.default.createElement(lt,null))))},useFlow:()=>{let i=h();return(0,A.useMemo)(()=>({push(n,m,a){i.push({activityId:O(),activityName:n,params:m})},replace(n,m,a){i.replace({activityId:O(),activityName:n,params:m})},pop(n){i.pop()}}),[i.push,i.replace,i.pop])}}}var kt=require("react");var Wt=()=>{let t=h();return(0,kt.useMemo)(()=>({push:t.push,replace:t.replace,pop:t.pop}),[t])}; | ||
var __create = Object.create; | ||
var __defProp = Object.defineProperty; | ||
var __defProps = Object.defineProperties; | ||
var __getOwnPropDesc = Object.getOwnPropertyDescriptor; | ||
var __getOwnPropDescs = Object.getOwnPropertyDescriptors; | ||
var __getOwnPropNames = Object.getOwnPropertyNames; | ||
var __getOwnPropSymbols = Object.getOwnPropertySymbols; | ||
var __getProtoOf = Object.getPrototypeOf; | ||
var __hasOwnProp = Object.prototype.hasOwnProperty; | ||
var __propIsEnum = Object.prototype.propertyIsEnumerable; | ||
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value; | ||
var __spreadValues = (a, b) => { | ||
for (var prop in b || (b = {})) | ||
if (__hasOwnProp.call(b, prop)) | ||
__defNormalProp(a, prop, b[prop]); | ||
if (__getOwnPropSymbols) | ||
for (var prop of __getOwnPropSymbols(b)) { | ||
if (__propIsEnum.call(b, prop)) | ||
__defNormalProp(a, prop, b[prop]); | ||
} | ||
return a; | ||
}; | ||
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b)); | ||
var __export = (target, all) => { | ||
for (var name in all) | ||
__defProp(target, name, { get: all[name], enumerable: true }); | ||
}; | ||
var __copyProps = (to, from, except, desc) => { | ||
if (from && typeof from === "object" || typeof from === "function") { | ||
for (let key of __getOwnPropNames(from)) | ||
if (!__hasOwnProp.call(to, key) && key !== except) | ||
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); | ||
} | ||
return to; | ||
}; | ||
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod)); | ||
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); | ||
// src/index.ts | ||
var src_exports = {}; | ||
__export(src_exports, { | ||
stackflow: () => stackflow, | ||
useActions: () => useActions, | ||
useActivity: () => useActivity, | ||
useActivityParams: () => useActivityParams, | ||
usePlugins: () => usePlugins, | ||
useStack: () => useStack | ||
}); | ||
module.exports = __toCommonJS(src_exports); | ||
// src/activity/useActivity.ts | ||
var import_react2 = require("react"); | ||
// src/activity/ActivityContext.ts | ||
var import_react = require("react"); | ||
var ActivityContext = (0, import_react.createContext)(null); | ||
// src/activity/useActivity.ts | ||
var useActivity = () => (0, import_react2.useContext)(ActivityContext); | ||
// src/activity/useActivityParams.ts | ||
var import_react3 = require("react"); | ||
function useActivityParams() { | ||
return (0, import_react3.useContext)(ActivityContext).params; | ||
} | ||
// src/plugins/usePlugins.ts | ||
var import_react5 = require("react"); | ||
// src/plugins/PluginsContext.tsx | ||
var import_react4 = require("react"); | ||
var PluginsContext = (0, import_react4.createContext)(null); | ||
// src/plugins/usePlugins.ts | ||
function usePlugins() { | ||
return (0, import_react5.useContext)(PluginsContext); | ||
} | ||
// src/stack/useStack.ts | ||
var import_react7 = require("react"); | ||
// src/stack/StackContext.ts | ||
var import_react6 = require("react"); | ||
var StackContext = (0, import_react6.createContext)(null); | ||
// src/stack/useStack.ts | ||
var useStack = () => (0, import_react7.useContext)(StackContext); | ||
// src/stackflow.tsx | ||
var import_react23 = __toESM(require("react")); | ||
// src/context/ContextContext.ts | ||
var import_react8 = require("react"); | ||
var ContextContext = (0, import_react8.createContext)({}); | ||
// src/context/ContextProvider.tsx | ||
var import_react9 = __toESM(require("react")); | ||
var ContextProvider = ({ | ||
children, | ||
value | ||
}) => /* @__PURE__ */ import_react9.default.createElement(ContextContext.Provider, { | ||
value | ||
}, children); | ||
// src/context/useContext.ts | ||
var import_react10 = __toESM(require("react")); | ||
function useContext5() { | ||
return import_react10.default.useContext(ContextContext); | ||
} | ||
// src/core/CoreProvider.tsx | ||
var import_core2 = require("@stackflow/core"); | ||
var import_react15 = __toESM(require("react")); | ||
var import_react_fast_compare = __toESM(require("react-fast-compare")); | ||
// src/activity/ActivityProvider.tsx | ||
var import_react11 = __toESM(require("react")); | ||
var ActivityProvider = ({ | ||
children, | ||
value | ||
}) => /* @__PURE__ */ import_react11.default.createElement(ActivityContext.Provider, { | ||
value | ||
}, children); | ||
// src/activity/makeActivityId.ts | ||
var import_core = require("@stackflow/core"); | ||
function makeActivityId() { | ||
return (0, import_core.id)(); | ||
} | ||
// src/plugins/PluginsProvider.tsx | ||
var import_react12 = __toESM(require("react")); | ||
var PluginsProvider = ({ | ||
children, | ||
value | ||
}) => /* @__PURE__ */ import_react12.default.createElement(PluginsContext.Provider, { | ||
value | ||
}, children); | ||
// src/core/CoreActionsContext.ts | ||
var import_react13 = require("react"); | ||
var CoreActionsContext = (0, import_react13.createContext)(null); | ||
// src/core/CoreStateContext.ts | ||
var import_react14 = require("react"); | ||
var CoreStateContext = (0, import_react14.createContext)(null); | ||
// src/core/CoreProvider.tsx | ||
var SECOND = 1e3; | ||
var INTERVAL_MS = SECOND / 60; | ||
var CoreProvider = ({ | ||
transitionDuration, | ||
initialActivity, | ||
activities, | ||
children | ||
}) => { | ||
const plugins = usePlugins(); | ||
const context = useContext5(); | ||
const initialEvents = (0, import_react15.useMemo)(() => { | ||
const initialEventDate = new Date().getTime() - transitionDuration; | ||
const initialPushedEventByPlugin = plugins.reduce((acc, plugin) => { | ||
var _a, _b; | ||
return (_b = (_a = plugin.initialPushedEvent) == null ? void 0 : _a.call(plugin)) != null ? _b : acc; | ||
}, null); | ||
const initialPushedEventByOption = initialActivity ? (0, import_core2.makeEvent)("Pushed", { | ||
activityId: makeActivityId(), | ||
activityName: initialActivity({ context }), | ||
params: {}, | ||
eventDate: initialEventDate | ||
}) : null; | ||
if (initialPushedEventByPlugin && initialPushedEventByOption) { | ||
console.warn(`Stackflow - Some plugin overrides an "initialActivity" option. The "initialActivity" option you set to "${initialPushedEventByOption.activityName}" in the "stackflow" is ignored.`); | ||
} | ||
const initialPushedEvent = initialPushedEventByPlugin != null ? initialPushedEventByPlugin : initialPushedEventByOption; | ||
const activityRegisteredEvents = Object.keys(activities).map((activityName) => (0, import_core2.makeEvent)("ActivityRegistered", { | ||
activityName, | ||
eventDate: initialEventDate | ||
})); | ||
const events = [ | ||
(0, import_core2.makeEvent)("Initialized", { | ||
transitionDuration, | ||
eventDate: initialEventDate | ||
}), | ||
...activityRegisteredEvents | ||
]; | ||
if (initialPushedEvent) { | ||
events.push(initialPushedEvent); | ||
} | ||
return events; | ||
}, []); | ||
const initialState = (0, import_react15.useMemo)(() => (0, import_core2.aggregate)(initialEvents, new Date().getTime()), []); | ||
const [state, setState] = (0, import_react15.useState)(() => initialState); | ||
const eventsRef = (0, import_react15.useRef)(initialEvents); | ||
const stateRef = (0, import_react15.useRef)(initialState); | ||
const getState = (0, import_react15.useCallback)(() => stateRef.current, [stateRef]); | ||
const dispatchEvent = (0, import_react15.useCallback)((name, parameters) => { | ||
const newEvent = (0, import_core2.makeEvent)(name, parameters); | ||
const events = [...eventsRef.current, newEvent]; | ||
eventsRef.current = events; | ||
setState((0, import_core2.aggregate)(events, new Date().getTime())); | ||
}, [eventsRef, setState]); | ||
(0, import_react15.useEffect)(() => { | ||
const interval = setInterval(() => { | ||
const events = eventsRef.current; | ||
const nextState = (0, import_core2.aggregate)(events, new Date().getTime()); | ||
if (!(0, import_react_fast_compare.default)(state, nextState)) { | ||
setState(nextState); | ||
stateRef.current = nextState; | ||
} | ||
if (nextState.globalTransitionState === "idle") { | ||
clearInterval(interval); | ||
} | ||
}, INTERVAL_MS); | ||
return () => { | ||
clearInterval(interval); | ||
}; | ||
}, [eventsRef, state, setState]); | ||
return /* @__PURE__ */ import_react15.default.createElement(CoreStateContext.Provider, { | ||
value: state | ||
}, /* @__PURE__ */ import_react15.default.createElement(CoreActionsContext.Provider, { | ||
value: (0, import_react15.useMemo)(() => ({ | ||
getState, | ||
dispatchEvent | ||
}), [getState, dispatchEvent]) | ||
}, children)); | ||
}; | ||
// src/core/useCoreActions.ts | ||
var import_react16 = __toESM(require("react")); | ||
var useCoreActions = () => { | ||
const plugins = usePlugins(); | ||
const context = useContext5(); | ||
const { dispatchEvent, getState } = import_react16.default.useContext(CoreActionsContext); | ||
const triggerPreEffectHook = (0, import_react16.useCallback)((preEffect) => { | ||
let isPrevented = false; | ||
const preventDefault = () => { | ||
isPrevented = true; | ||
}; | ||
plugins.forEach((plugin) => { | ||
var _a, _b, _c; | ||
switch (preEffect) { | ||
case "PUSHED": | ||
(_a = plugin.onBeforePush) == null ? void 0 : _a.call(plugin, { | ||
actions: { | ||
dispatchEvent, | ||
getState, | ||
preventDefault | ||
} | ||
}); | ||
break; | ||
case "REPLACED": | ||
(_b = plugin.onBeforeReplace) == null ? void 0 : _b.call(plugin, { | ||
actions: { | ||
dispatchEvent, | ||
getState, | ||
preventDefault | ||
} | ||
}); | ||
break; | ||
case "POPPED": | ||
(_c = plugin.onBeforePop) == null ? void 0 : _c.call(plugin, { | ||
actions: { | ||
dispatchEvent, | ||
getState, | ||
preventDefault | ||
} | ||
}); | ||
break; | ||
default: | ||
break; | ||
} | ||
}); | ||
return { isPrevented }; | ||
}, [plugins, dispatchEvent, getState, context]); | ||
const push = (0, import_react16.useCallback)(({ | ||
activityId, | ||
activityName, | ||
params | ||
}) => { | ||
const { isPrevented } = triggerPreEffectHook("PUSHED"); | ||
if (!isPrevented) { | ||
dispatchEvent("Pushed", { | ||
activityId, | ||
activityName, | ||
params | ||
}); | ||
} | ||
}, [dispatchEvent]); | ||
const replace = (0, import_react16.useCallback)(({ | ||
activityId, | ||
activityName, | ||
params | ||
}) => { | ||
const { isPrevented } = triggerPreEffectHook("REPLACED"); | ||
if (!isPrevented) { | ||
dispatchEvent("Replaced", { | ||
activityId, | ||
activityName, | ||
params | ||
}); | ||
} | ||
}, [dispatchEvent]); | ||
const pop = (0, import_react16.useCallback)(() => { | ||
const { isPrevented } = triggerPreEffectHook("POPPED"); | ||
if (!isPrevented) { | ||
dispatchEvent("Popped", {}); | ||
} | ||
}, [dispatchEvent]); | ||
return (0, import_react16.useMemo)(() => ({ | ||
dispatchEvent, | ||
getState, | ||
push, | ||
replace, | ||
pop | ||
}), [dispatchEvent, getState, push, replace, pop]); | ||
}; | ||
// src/core/useCoreState.ts | ||
var import_react17 = __toESM(require("react")); | ||
var useCoreState = () => import_react17.default.useContext(CoreStateContext); | ||
// src/EffectManager.tsx | ||
var import_core3 = require("@stackflow/core"); | ||
var import_react18 = require("react"); | ||
var EffectManager = () => { | ||
const plugins = usePlugins(); | ||
const coreState = useCoreState(); | ||
const coreActions = useCoreActions(); | ||
const onInit = (0, import_react18.useCallback)((actions) => { | ||
plugins.forEach((plugin) => { | ||
var _a; | ||
(_a = plugin.onInit) == null ? void 0 : _a.call(plugin, actions); | ||
}); | ||
}, []); | ||
const triggerEffect = (0, import_react18.useCallback)(({ actions, effect }) => { | ||
switch (effect._TAG) { | ||
case "PUSHED": { | ||
plugins.forEach((plugin) => { | ||
var _a; | ||
return (_a = plugin.onPushed) == null ? void 0 : _a.call(plugin, { actions, effect }); | ||
}); | ||
break; | ||
} | ||
case "POPPED": { | ||
plugins.forEach((plugin) => { | ||
var _a; | ||
return (_a = plugin.onPopped) == null ? void 0 : _a.call(plugin, { actions, effect }); | ||
}); | ||
break; | ||
} | ||
case "REPLACED": { | ||
plugins.forEach((plugin) => { | ||
var _a; | ||
return (_a = plugin.onReplaced) == null ? void 0 : _a.call(plugin, { actions, effect }); | ||
}); | ||
break; | ||
} | ||
case "%SOMETHING_CHANGED%": { | ||
plugins.forEach((plugin) => { | ||
var _a; | ||
return (_a = plugin.onChanged) == null ? void 0 : _a.call(plugin, { actions, effect }); | ||
}); | ||
break; | ||
} | ||
default: { | ||
break; | ||
} | ||
} | ||
}, []); | ||
(0, import_react18.useEffect)(() => { | ||
onInit == null ? void 0 : onInit({ | ||
actions: { | ||
dispatchEvent: coreActions.dispatchEvent, | ||
getState: coreActions.getState | ||
} | ||
}); | ||
}, []); | ||
const prevStateRef = (0, import_react18.useRef)(coreState); | ||
(0, import_react18.useEffect)(() => { | ||
const prevState = prevStateRef.current; | ||
const effects = prevState ? (0, import_core3.produceEffects)(prevState, coreState) : []; | ||
effects.forEach((effect) => { | ||
triggerEffect({ | ||
actions: { | ||
dispatchEvent: coreActions.dispatchEvent, | ||
getState: coreActions.getState | ||
}, | ||
effect | ||
}); | ||
}); | ||
prevStateRef.current = __spreadValues({}, coreState); | ||
}, [coreState]); | ||
return null; | ||
}; | ||
var EffectManager_default = EffectManager; | ||
// src/MainRenderer.tsx | ||
var import_react21 = __toESM(require("react")); | ||
// src/PluginRenderer.tsx | ||
var import_react20 = __toESM(require("react")); | ||
// src/stack/StackProvider.tsx | ||
var import_react19 = __toESM(require("react")); | ||
var StackProvider = ({ | ||
children, | ||
value | ||
}) => /* @__PURE__ */ import_react19.default.createElement(StackContext.Provider, { | ||
value | ||
}, children); | ||
// src/PluginRenderer.tsx | ||
var PluginRenderer = ({ | ||
activities, | ||
plugin | ||
}) => { | ||
const coreState = useCoreState(); | ||
const plugins = usePlugins(); | ||
return plugin.render({ | ||
stack: __spreadProps(__spreadValues({}, coreState), { | ||
render(overrideStack) { | ||
const stack = __spreadValues(__spreadValues({}, coreState), overrideStack); | ||
return { | ||
activities: stack.activities.map((activity) => __spreadProps(__spreadValues({}, activity), { | ||
key: activity.id, | ||
render(overrideActivity) { | ||
const ActivityComponent = activities[activity.name]; | ||
let output = /* @__PURE__ */ import_react20.default.createElement(ActivityComponent, __spreadValues({}, activity.params)); | ||
plugins.forEach((p) => { | ||
var _a, _b; | ||
output = (_b = (_a = p.wrapActivity) == null ? void 0 : _a.call(p, { | ||
activity: __spreadProps(__spreadValues({}, activity), { | ||
render: () => output | ||
}) | ||
})) != null ? _b : output; | ||
}); | ||
return /* @__PURE__ */ import_react20.default.createElement(StackProvider, { | ||
value: stack | ||
}, /* @__PURE__ */ import_react20.default.createElement(ActivityProvider, { | ||
key: activity.id, | ||
value: __spreadValues(__spreadValues({}, activity), overrideActivity) | ||
}, output)); | ||
} | ||
})) | ||
}; | ||
} | ||
}) | ||
}); | ||
}; | ||
var PluginRenderer_default = PluginRenderer; | ||
// src/MainRenderer.tsx | ||
var MainRenderer = ({ activities }) => { | ||
const coreState = useCoreState(); | ||
const plugins = usePlugins(); | ||
const renderPlugins = plugins.filter((plugin) => !!plugin.render); | ||
(0, import_react21.useEffect)(() => { | ||
if (renderPlugins.length === 0) { | ||
console.warn(`Stackflow - There is no rendering plugin, so "<Stack />" doesn't render anything. If you want to render some UI, use "@stackflow/plugin-renderer-basic" or add another rendering plugin.`); | ||
} | ||
}, [renderPlugins]); | ||
let output = /* @__PURE__ */ import_react21.default.createElement(import_react21.default.Fragment, null, renderPlugins.map((plugin) => /* @__PURE__ */ import_react21.default.createElement(PluginRenderer_default, { | ||
activities, | ||
key: plugin.key, | ||
plugin | ||
}))); | ||
plugins.forEach((plugin) => { | ||
var _a, _b; | ||
output = (_b = (_a = plugin.wrapStack) == null ? void 0 : _a.call(plugin, { | ||
stack: __spreadProps(__spreadValues({}, coreState), { | ||
render() { | ||
return output; | ||
} | ||
}) | ||
})) != null ? _b : output; | ||
}); | ||
return output; | ||
}; | ||
var MainRenderer_default = MainRenderer; | ||
// src/useActions.ts | ||
var import_react22 = require("react"); | ||
function useActions() { | ||
const coreActions = useCoreActions(); | ||
return (0, import_react22.useMemo)(() => ({ | ||
push(activityName, params, options) { | ||
coreActions.push({ | ||
activityId: makeActivityId(), | ||
activityName, | ||
params | ||
}); | ||
}, | ||
replace(activityName, params, options) { | ||
coreActions.replace({ | ||
activityId: makeActivityId(), | ||
activityName, | ||
params | ||
}); | ||
}, | ||
pop(options) { | ||
coreActions.pop(); | ||
} | ||
}), [coreActions.push, coreActions.replace, coreActions.pop]); | ||
} | ||
// src/stackflow.tsx | ||
function stackflow(options) { | ||
return { | ||
Stack(props) { | ||
var _a; | ||
const plugins = (0, import_react23.useMemo)(() => { | ||
var _a2; | ||
return ((_a2 = options.plugins) != null ? _a2 : []).reduce((plugins2, plugin) => [ | ||
...plugins2, | ||
...Array.isArray(plugin) ? plugin : [plugin] | ||
], []).map((plugin) => plugin({ context: props.context })); | ||
}, []); | ||
return /* @__PURE__ */ import_react23.default.createElement(ContextProvider, { | ||
value: (_a = props.context) != null ? _a : {} | ||
}, /* @__PURE__ */ import_react23.default.createElement(PluginsProvider, { | ||
value: plugins | ||
}, /* @__PURE__ */ import_react23.default.createElement(CoreProvider, { | ||
activities: options.activities, | ||
initialActivity: options.initialActivity, | ||
transitionDuration: options.transitionDuration | ||
}, /* @__PURE__ */ import_react23.default.createElement(MainRenderer_default, { | ||
activities: options.activities | ||
}), /* @__PURE__ */ import_react23.default.createElement(EffectManager_default, null)))); | ||
}, | ||
useFlow: useActions | ||
}; | ||
} | ||
//# sourceMappingURL=index.js.map |
import React from "react"; | ||
import { ActivityComponentType } from "./activity"; | ||
import { BaseActivities } from "./BaseActivities"; | ||
import { StackflowReactPlugin } from "./StackflowReactPlugin"; | ||
export declare type Activities = { | ||
[activityName: string]: ActivityComponentType<any>; | ||
}; | ||
import { UseActionsOutputType } from "./useActions"; | ||
export declare type StackProps<C extends {} = {}> = { | ||
context?: C; | ||
}; | ||
export declare type StackflowOptions<T extends Activities> = { | ||
export declare type StackComponentType = React.FC<StackProps>; | ||
export declare type StackflowOptions<T extends BaseActivities> = { | ||
activities: T; | ||
@@ -18,15 +17,6 @@ transitionDuration: number; | ||
}; | ||
export declare function stackflow<T extends Activities>(options: StackflowOptions<T>): { | ||
Stack: React.FC<StackProps<{}>>; | ||
useFlow: () => { | ||
push<V extends Extract<keyof T, string>>(activityName: V, params: T[V] extends ActivityComponentType<infer U> ? U : {}, options?: { | ||
animate?: boolean | undefined; | ||
} | undefined): void; | ||
replace<V_1 extends Extract<keyof T, string>>(activityName: V_1, params: T[V_1] extends ActivityComponentType<infer U_1> ? U_1 : {}, options?: { | ||
animate?: boolean | undefined; | ||
} | undefined): void; | ||
pop(options?: { | ||
animate?: boolean | undefined; | ||
} | undefined): void; | ||
}; | ||
export declare type StackflowOutput<T extends BaseActivities> = { | ||
Stack: StackComponentType; | ||
useFlow: () => UseActionsOutputType<T>; | ||
}; | ||
export declare function stackflow<T extends BaseActivities>(options: StackflowOptions<T>): StackflowOutput<T>; |
@@ -1,17 +0,14 @@ | ||
export declare const useActions: () => { | ||
push: ({ activityId, activityName, params, }: { | ||
activityId: string; | ||
activityName: string; | ||
params: { | ||
[key: string]: string; | ||
}; | ||
import { ActivityComponentType } from "./activity"; | ||
import { BaseActivities } from "./BaseActivities"; | ||
export declare type UseActionsOutputType<T extends BaseActivities> = { | ||
push: <V extends Extract<keyof T, string>>(activityName: V, params: T[V] extends ActivityComponentType<infer U> ? U : {}, options?: { | ||
animate?: boolean; | ||
}) => void; | ||
replace: ({ activityId, activityName, params, }: { | ||
activityId: string; | ||
activityName: string; | ||
params: { | ||
[key: string]: string; | ||
}; | ||
replace: <V extends Extract<keyof T, string>>(activityName: V, params: T[V] extends ActivityComponentType<infer U> ? U : {}, options?: { | ||
animate?: boolean; | ||
}) => void; | ||
pop: () => void; | ||
pop: (options?: { | ||
animate?: boolean; | ||
}) => void; | ||
}; | ||
export declare function useActions<T extends BaseActivities>(): UseActionsOutputType<T>; |
{ | ||
"name": "@stackflow/react", | ||
"version": "0.1.1-alpha.164+73076db", | ||
"version": "0.1.1-alpha.172+f372be6", | ||
"license": "Apache-2.0", | ||
@@ -31,3 +31,3 @@ "exports": { | ||
"devDependencies": { | ||
"@stackflow/core": "^0.1.1-alpha.164+73076db", | ||
"@stackflow/core": "^0.1.1-alpha.172+f372be6", | ||
"@types/react": "^18.0.9", | ||
@@ -53,3 +53,3 @@ "react": "^18.1.0", | ||
}, | ||
"gitHead": "73076db6cd02ee5db769db240fcc59c01b8d3984" | ||
"gitHead": "f372be6903b87738dabf3d0d50f85da26d5419b8" | ||
} |
import { useMemo } from "react"; | ||
import { ActivityComponentType, makeActivityId } from "./activity"; | ||
import { BaseActivities } from "./BaseActivities"; | ||
import { useCoreActions } from "./core"; | ||
export const useActions = () => { | ||
export type UseActionsOutputType<T extends BaseActivities> = { | ||
push: <V extends Extract<keyof T, string>>( | ||
activityName: V, | ||
params: T[V] extends ActivityComponentType<infer U> ? U : {}, | ||
options?: { | ||
animate?: boolean; | ||
}, | ||
) => void; | ||
replace: <V extends Extract<keyof T, string>>( | ||
activityName: V, | ||
params: T[V] extends ActivityComponentType<infer U> ? U : {}, | ||
options?: { | ||
animate?: boolean; | ||
}, | ||
) => void; | ||
pop: (options?: { animate?: boolean }) => void; | ||
}; | ||
export function useActions< | ||
T extends BaseActivities, | ||
>(): UseActionsOutputType<T> { | ||
const coreActions = useCoreActions(); | ||
@@ -10,8 +32,22 @@ | ||
() => ({ | ||
push: coreActions.push, | ||
replace: coreActions.replace, | ||
pop: coreActions.pop, | ||
push(activityName, params, options) { | ||
coreActions.push({ | ||
activityId: makeActivityId(), | ||
activityName, | ||
params, | ||
}); | ||
}, | ||
replace(activityName, params, options) { | ||
coreActions.replace({ | ||
activityId: makeActivityId(), | ||
activityName, | ||
params, | ||
}); | ||
}, | ||
pop(options) { | ||
coreActions.pop(); | ||
}, | ||
}), | ||
[coreActions], | ||
[coreActions.push, coreActions.replace, coreActions.pop], | ||
); | ||
}; | ||
} |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Manifest confusion
Supply chain riskThis package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Manifest confusion
Supply chain riskThis package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
133513
77
1900
2