@stackflow/plugin-history-sync
Advanced tools
Comparing version 0.1.1-alpha.172 to 0.2.0
@@ -1,221 +0,2 @@ | ||
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, { | ||
historySyncPlugin: () => historySyncPlugin | ||
}); | ||
module.exports = __toCommonJS(src_exports); | ||
// src/historySyncPlugin.tsx | ||
var import_core = require("@stackflow/core"); | ||
// src/makeTemplate.ts | ||
var import_url_pattern = __toESM(require("url-pattern")); | ||
function pathToUrl(path) { | ||
return new URL(path, "file://"); | ||
} | ||
function urlSearchParamsToMap(urlSearchParams) { | ||
const map = {}; | ||
urlSearchParams.forEach((value, key) => { | ||
map[key] = value; | ||
}); | ||
return map; | ||
} | ||
function appendTrailingSlashInPathname(pathname) { | ||
if (pathname.endsWith("/")) { | ||
return pathname; | ||
} | ||
return `${pathname}/`; | ||
} | ||
function prependQuestionMarkInSearchParams(searchParams) { | ||
const searchParamsStr = searchParams.toString(); | ||
if (searchParamsStr.length > 0) { | ||
return `?${searchParams}`; | ||
} | ||
return searchParams; | ||
} | ||
function makeTemplate(templateStr) { | ||
const pattern = new import_url_pattern.default(`${templateStr}(/)`); | ||
return { | ||
fill(params) { | ||
var _a; | ||
const pathname = pattern.stringify(params); | ||
const pathParams = (_a = pattern.match(pathname)) != null ? _a : {}; | ||
const searchParamsMap = __spreadValues({}, params); | ||
Object.keys(pathParams).forEach((key) => { | ||
delete searchParamsMap[key]; | ||
}); | ||
const searchParams = new URLSearchParams(searchParamsMap); | ||
return appendTrailingSlashInPathname(pathname) + prependQuestionMarkInSearchParams(searchParams); | ||
}, | ||
parse(path) { | ||
const url = pathToUrl(path); | ||
const pathParams = pattern.match(url.pathname); | ||
const searchParams = urlSearchParamsToMap(url.searchParams); | ||
if (!pathParams) { | ||
return null; | ||
} | ||
return __spreadValues(__spreadValues({}, searchParams), pathParams); | ||
} | ||
}; | ||
} | ||
// src/historySyncPlugin.tsx | ||
var STATE_TAG = `${"@stackflow/plugin-history-sync"}@${"0.1.0"}`; | ||
var SECOND = 1e3; | ||
var MINUTE = 60 * SECOND; | ||
function parseState(state) { | ||
const _state = state; | ||
if (typeof _state === "object" && _state !== null && "_TAG" in _state && typeof _state._TAG === "string" && _state._TAG === STATE_TAG) { | ||
return state; | ||
} | ||
return null; | ||
} | ||
function pushState(state, url) { | ||
window.history.pushState(state, "", url); | ||
} | ||
function replaceState(state, url) { | ||
window.history.replaceState(state, "", url); | ||
} | ||
function historySyncPlugin(options) { | ||
return ({ context }) => { | ||
let pushFlag = false; | ||
let onPopStateDisposer = null; | ||
return { | ||
key: "historySync", | ||
initialPushedEvent() { | ||
var _a; | ||
const initHistoryState = parseState(window.history.state); | ||
if (initHistoryState) { | ||
return __spreadProps(__spreadValues({}, initHistoryState.activity.pushedBy), { | ||
name: "Pushed" | ||
}); | ||
} | ||
const path = ((_a = context == null ? void 0 : context.req) == null ? void 0 : _a.path) ? context.req.path : typeof window !== "undefined" ? window.location.pathname + window.location.search : null; | ||
if (!path) { | ||
return null; | ||
} | ||
const activityNames = Object.keys(options.routes); | ||
for (let i = 0; i < activityNames.length; i += 1) { | ||
const activityName = activityNames[i]; | ||
const template = makeTemplate(options.routes[activityName]); | ||
const params = template.parse(path); | ||
if (params) { | ||
return (0, import_core.makeEvent)("Pushed", { | ||
activityId: (0, import_core.id)(), | ||
activityName, | ||
params, | ||
eventDate: new Date().getTime() - MINUTE | ||
}); | ||
} | ||
} | ||
return (0, import_core.makeEvent)("Pushed", { | ||
activityId: (0, import_core.id)(), | ||
activityName: options.fallbackActivity({ context }), | ||
params: {}, | ||
eventDate: new Date().getTime() - MINUTE | ||
}); | ||
}, | ||
onInit({ actions: { getState, dispatchEvent } }) { | ||
const rootActivity = getState().activities[0]; | ||
const template = makeTemplate(options.routes[rootActivity.name]); | ||
replaceState({ | ||
_TAG: STATE_TAG, | ||
activity: rootActivity | ||
}, template.fill(rootActivity.params)); | ||
const onPopState = (e) => { | ||
const historyState = parseState(e.state); | ||
if (!historyState) { | ||
return; | ||
} | ||
const { activities } = getState(); | ||
const targetActivity = activities.find((activity) => activity.id === historyState.activity.pushedBy.activityId); | ||
const isBackward = !targetActivity && historyState.activity.pushedBy.activityId < activities[0].id || (targetActivity == null ? void 0 : targetActivity.transitionState) === "enter-active" || (targetActivity == null ? void 0 : targetActivity.transitionState) === "enter-done"; | ||
const isForward = !targetActivity && historyState.activity.pushedBy.activityId > activities[activities.length - 1].id || (targetActivity == null ? void 0 : targetActivity.transitionState) === "exit-active" || (targetActivity == null ? void 0 : targetActivity.transitionState) === "exit-done"; | ||
if (isBackward) { | ||
dispatchEvent("Popped", {}); | ||
if (!targetActivity) { | ||
pushFlag = true; | ||
dispatchEvent("Pushed", __spreadValues({}, historyState.activity.pushedBy)); | ||
} | ||
} | ||
if (isForward) { | ||
pushFlag = true; | ||
dispatchEvent("Pushed", { | ||
activityId: historyState.activity.pushedBy.activityId, | ||
activityName: historyState.activity.pushedBy.activityName, | ||
params: historyState.activity.pushedBy.params | ||
}); | ||
} | ||
}; | ||
onPopStateDisposer == null ? void 0 : onPopStateDisposer(); | ||
window.addEventListener("popstate", onPopState); | ||
onPopStateDisposer = () => { | ||
window.removeEventListener("popstate", onPopState); | ||
}; | ||
}, | ||
onPushed({ effect: { activity } }) { | ||
if (pushFlag) { | ||
pushFlag = false; | ||
return; | ||
} | ||
const template = makeTemplate(options.routes[activity.name]); | ||
pushState({ | ||
_TAG: STATE_TAG, | ||
activity | ||
}, template.fill(activity.params)); | ||
}, | ||
onReplaced({ effect: { activity } }) { | ||
const template = makeTemplate(options.routes[activity.name]); | ||
replaceState({ | ||
_TAG: STATE_TAG, | ||
activity | ||
}, template.fill(activity.params)); | ||
}, | ||
onBeforePop({ actions: { preventDefault } }) { | ||
preventDefault(); | ||
do { | ||
window.history.back(); | ||
} while (!parseState(window.history.state)); | ||
} | ||
}; | ||
}; | ||
} | ||
var G=Object.create;var f=Object.defineProperty,U=Object.defineProperties,b=Object.getOwnPropertyDescriptor,L=Object.getOwnPropertyDescriptors,O=Object.getOwnPropertyNames,w=Object.getOwnPropertySymbols,R=Object.getPrototypeOf,T=Object.prototype.hasOwnProperty,M=Object.prototype.propertyIsEnumerable;var P=(t,e,n)=>e in t?f(t,e,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[e]=n,p=(t,e)=>{for(var n in e||(e={}))T.call(e,n)&&P(t,n,e[n]);if(w)for(var n of w(e))M.call(e,n)&&P(t,n,e[n]);return t},g=(t,e)=>U(t,L(e));var $=(t,e)=>{for(var n in e)f(t,n,{get:e[n],enumerable:!0})},k=(t,e,n,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of O(e))!T.call(t,a)&&a!==n&&f(t,a,{get:()=>e[a],enumerable:!(i=b(e,a))||i.enumerable});return t};var x=(t,e,n)=>(n=t!=null?G(R(t)):{},k(e||!t||!t.__esModule?f(n,"default",{value:t,enumerable:!0}):n,t)),D=t=>k(f({},"__esModule",{value:!0}),t);var V={};$(V,{historySyncPlugin:()=>Q});module.exports=D(V);var d=require("@stackflow/core");var E=x(require("url-pattern"));function j(t){return new URL(t,"file://")}function C(t){let e={};return t.forEach((n,i)=>{e[i]=n}),e}function H(t){return t.endsWith("/")?t:`${t}/`}function q(t){return t.toString().length>0?`?${t}`:t}function m(t){let e=new E.default(`${t}(/)`);return{fill(n){var l;let i=e.stringify(n),a=(l=e.match(i))!=null?l:{},r=p({},n);Object.keys(a).forEach(u=>{delete r[u]});let c=new URLSearchParams(r);return H(i)+q(c)},parse(n){let i=j(n),a=e.match(i.pathname),r=C(i.searchParams);return a?p(p({},r),a):null}}}var S="@stackflow/plugin-history-sync@0.1.0",F=1e3,A=60*F;function v(t){let e=t;return typeof e=="object"&&e!==null&&"_TAG"in e&&typeof e._TAG=="string"&&e._TAG===S?t:null}function K(t,e){window.history.pushState(t,"",e)}function I(t,e){window.history.replaceState(t,"",e)}function Q(t){return({context:e})=>{let n=!1,i=null;return{key:"historySync",initialPushedEvent(){var l;let a=v(window.history.state);if(a)return g(p({},a.activity.pushedBy),{name:"Pushed"});let r=(l=e==null?void 0:e.req)!=null&&l.path?e.req.path:typeof window!="undefined"?window.location.pathname+window.location.search:null;if(!r)return null;let c=Object.keys(t.routes);for(let u=0;u<c.length;u+=1){let h=c[u],y=m(t.routes[h]).parse(r);if(y)return(0,d.makeEvent)("Pushed",{activityId:(0,d.id)(),activityName:h,params:y,eventDate:new Date().getTime()-A})}return(0,d.makeEvent)("Pushed",{activityId:(0,d.id)(),activityName:t.fallbackActivity({context:e}),params:{},eventDate:new Date().getTime()-A})},onInit({actions:{getStack:a,dispatchEvent:r}}){let c=a().activities[0],l=m(t.routes[c.name]);I({_TAG:S,activity:c},l.fill(c.params));let u=h=>{let o=v(h.state);if(!o)return;let{activities:y}=a(),s=y.find(B=>B.id===o.activity.pushedBy.activityId),N=!s&&o.activity.pushedBy.activityId<y[0].id||(s==null?void 0:s.transitionState)==="enter-active"||(s==null?void 0:s.transitionState)==="enter-done",_=!s&&o.activity.pushedBy.activityId>y[y.length-1].id||(s==null?void 0:s.transitionState)==="exit-active"||(s==null?void 0:s.transitionState)==="exit-done";N&&(r("Popped",{}),s||(n=!0,r("Pushed",p({},o.activity.pushedBy)))),_&&(n=!0,r("Pushed",{activityId:o.activity.pushedBy.activityId,activityName:o.activity.pushedBy.activityName,params:o.activity.pushedBy.params}))};i==null||i(),window.addEventListener("popstate",u),i=()=>{window.removeEventListener("popstate",u)}},onPushed({effect:{activity:a}}){if(n){n=!1;return}let r=m(t.routes[a.name]);K({_TAG:S,activity:a},r.fill(a.params))},onReplaced({effect:{activity:a}}){let r=m(t.routes[a.name]);I({_TAG:S,activity:a},r.fill(a.params))},onBeforePop({actions:{preventDefault:a}}){a();do window.history.back();while(!v(window.history.state))}}}} | ||
//# sourceMappingURL=index.js.map |
{ | ||
"name": "@stackflow/plugin-history-sync", | ||
"version": "0.1.1-alpha.172+f372be6", | ||
"version": "0.2.0", | ||
"license": "Apache-2.0", | ||
@@ -30,4 +30,4 @@ "exports": { | ||
"devDependencies": { | ||
"@stackflow/core": "^0.1.1-alpha.172+f372be6", | ||
"@stackflow/esbuild-config": "^0.1.1-alpha.172+f372be6", | ||
"@stackflow/core": "^0.2.0", | ||
"@stackflow/esbuild-config": "^0.2.0", | ||
"@types/react": "^18.0.10", | ||
@@ -54,3 +54,3 @@ "react": "^18.1.0", | ||
}, | ||
"gitHead": "f372be6903b87738dabf3d0d50f85da26d5419b8" | ||
"gitHead": "7fa3ce6d240d2cc8e959cba76f6b21b9fbef8ce9" | ||
} |
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
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
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
0
47907
278
3