@stackflow/plugin-history-sync - npm Package Compare versions

Comparing version 1.0.1 to 1.1.0

dist/historyState.d.ts

 import type { Activity, ActivityStep } from "@stackflow/core";
+import type { History } from "history";
 interface State {
@@ -6,11 +7,15 @@ activity: Activity;
 }
-export declare function getCurrentState(): unknown;
-export declare function parseState(state: unknown): State | null;
-export declare function pushState({ state, url, useHash, }: {
+export declare function safeParseState(state: unknown): State | null;
+export declare function getCurrentState({ history }: {
+    history: History;
+}): unknown;
+export declare function pushState({ history, pathname, state, useHash, }: {
+    history: History;
+    pathname: string;
     state: State;
-    url: string;
     useHash?: boolean;
 }): void;
-export declare function replaceState({ url, state, useHash, }: {
-    url: string;
+export declare function replaceState({ history, pathname, state, useHash, }: {
+    history: History;
+    pathname: string;
     state: State;
@@ -17,0 +22,0 @@ useHash?: boolean;

dist/historySyncPlugin.d.ts

 import type { StackflowReactPlugin } from "@stackflow/react";
+import type { History } from "history";
 declare type HistorySyncPluginOptions<K extends string> = {
@@ -10,2 +11,3 @@ routes: {
     useHash?: boolean;
+    history?: History;
 };
@@ -12,0 +14,0 @@ export declare function historySyncPlugin<T extends {

dist/index.js

@@ -59,23 +59,6 @@ "use strict";
 var import_core = require("@stackflow/core");
+var import_history = require("history");
 
-// src/utils/isServer.ts
-function isServer() {
-  return typeof window === "undefined";
-}
-
 // src/historyState.ts
-var STATE_TAG = `${"@stackflow/plugin-history-sync"}@${"1.0.0"}`;
-function getCurrentState() {
-  if (isServer()) {
-    return null;
-  }
-  return window.history.state;
-}
-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;
-}
+var STATE_TAG = `${"@stackflow/plugin-history-sync"}@${"1.0.1"}`;
 function serializeStep(step) {
@@ -104,23 +87,29 @@ return __spreadProps(__spreadValues({}, step), {
 }
+function safeParseState(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 getCurrentState({ history }) {
+  return history.location.state;
+}
 function pushState({
+  history,
+  pathname,
   state,
-  url,
   useHash
 }) {
-  if (isServer()) {
-    return;
-  }
-  const nextUrl = useHash ? `${window.location.pathname}#${url}` : url;
-  window.history.pushState(serializeState(state), "", nextUrl);
+  const nextPathname = useHash ? `${history.location.pathname}#${pathname}` : pathname;
+  history.push(nextPathname, serializeState(state));
 }
 function replaceState({
-  url,
+  history,
+  pathname,
   state,
   useHash
 }) {
-  if (isServer()) {
-    return;
-  }
-  const nextUrl = useHash ? `${window.location.pathname}#${url}` : url;
-  window.history.replaceState(serializeState(state), "", nextUrl);
+  const nextPathname = useHash ? `${history.location.pathname}#${pathname}` : pathname;
+  history.replace(nextPathname, serializeState(state));
 }
@@ -162,5 +151,4 @@
     fill(params) {
-      var _a;
       const pathname = pattern.stringify(params);
-      const pathParams = (_a = pattern.match(pathname)) != null ? _a : {};
+      const pathParams = pattern.match(pathname);
       const searchParamsMap = __spreadValues({}, params);
@@ -205,2 +193,7 @@ Object.keys(pathParams).forEach((key) => {
 function historySyncPlugin(options) {
+  var _a;
+  const history = (_a = options.history) != null ? _a : typeof window === "undefined" ? (0, import_history.createMemoryHistory)({}) : (0, import_history.createBrowserHistory)({
+    window
+  });
+  const { location } = history;
   return () => {
@@ -215,4 +208,6 @@ let pushFlag = 0;
       overrideInitialEvents({ initialContext }) {
-        var _a, _b;
-        const initialHistoryState = parseState(getCurrentState());
+        var _a2, _b;
+        const initialHistoryState = safeParseState(
+          getCurrentState({ history })
+        );
         if (initialHistoryState) {
@@ -223,3 +218,3 @@ return [
             }),
-            ...((_a = initialHistoryState.step) == null ? void 0 : _a.enteredBy.name) === "StepPushed" || ((_b = initialHistoryState.step) == null ? void 0 : _b.enteredBy.name) === "StepReplaced" ? [
+            ...((_a2 = initialHistoryState.step) == null ? void 0 : _a2.enteredBy.name) === "StepPushed" || ((_b = initialHistoryState.step) == null ? void 0 : _b.enteredBy.name) === "StepReplaced" ? [
               __spreadProps(__spreadValues({}, initialHistoryState.step.enteredBy), {
@@ -232,13 +227,10 @@ name: "StepPushed"
         function resolvePath() {
-          var _a2, _b2;
-          if (((_a2 = initialContext == null ? void 0 : initialContext.req) == null ? void 0 : _a2.path) && typeof initialContext.req.path === "string") {
+          var _a3, _b2;
+          if (((_a3 = initialContext == null ? void 0 : initialContext.req) == null ? void 0 : _a3.path) && typeof initialContext.req.path === "string") {
             return initialContext.req.path;
           }
-          if (isServer()) {
-            return null;
-          }
           if (options.useHash) {
-            return (_b2 = window.location.hash.split("#")[1]) != null ? _b2 : "/";
+            return (_b2 = location.hash.split("#")[1]) != null ? _b2 : "/";
           }
-          return window.location.pathname + window.location.search;
+          return location.pathname + location.search;
         }
@@ -298,6 +290,6 @@ const path = resolvePath();
         );
-        window.getStack = getStack;
         const lastStep = last(rootActivity.steps);
         replaceState({
-          url: template.fill(rootActivity.params),
+          history,
+          pathname: template.fill(rootActivity.params),
           state: {
@@ -314,3 +306,3 @@ activity: rootActivity,
           }
-          const historyState = parseState(e.state);
+          const historyState = safeParseState(e.location.state);
           if (!historyState) {
@@ -400,5 +392,3 @@ return;
         };
-        if (!isServer()) {
-          window.addEventListener("popstate", onPopState);
-        }
+        history.listen(onPopState);
       },
@@ -414,3 +404,4 @@ onPushed({ effect: { activity } }) {
         pushState({
-          url: template.fill(activity.params),
+          history,
+          pathname: template.fill(activity.params),
           state: {
@@ -431,3 +422,4 @@ activity
         pushState({
-          url: template.fill(activity.params),
+          history,
+          pathname: template.fill(activity.params),
           state: {
@@ -448,3 +440,4 @@ activity,
         replaceState({
-          url: template.fill(activity.params),
+          history,
+          pathname: template.fill(activity.params),
           state: {
@@ -464,3 +457,4 @@ activity
         replaceState({
-          url: template.fill(activity.params),
+          history,
+          pathname: template.fill(activity.params),
           state: {
@@ -496,6 +490,3 @@ activity,
       onBeforeStepPop({ actions: { getStack } }) {
-        var _a;
-        if (isServer()) {
-          return;
-        }
+        var _a2;
         const { activities } = getStack();
@@ -505,12 +496,9 @@ const currentActivity = activities.find(
         );
-        if (((_a = currentActivity == null ? void 0 : currentActivity.steps.length) != null ? _a : 0) > 1) {
+        if (((_a2 = currentActivity == null ? void 0 : currentActivity.steps.length) != null ? _a2 : 0) > 1) {
           popFlag += 1;
-          window.history.back();
+          history.back();
         }
       },
       onBeforePop({ actions: { getStack } }) {
-        var _a;
-        if (isServer()) {
-          return;
-        }
+        var _a2;
         const { activities } = getStack();
@@ -520,9 +508,9 @@ const currentActivity = activities.find(
         );
-        const popCount = (_a = currentActivity == null ? void 0 : currentActivity.steps.length) != null ? _a : 0;
+        const popCount = (_a2 = currentActivity == null ? void 0 : currentActivity.steps.length) != null ? _a2 : 0;
         popFlag += popCount;
         do {
           for (let i = 0; i < popCount; i += 1) {
-            window.history.back();
+            history.back();
           }
-        } while (!parseState(getCurrentState()));
+        } while (!safeParseState(getCurrentState({ history })));
       }
@@ -529,0 +517,0 @@ };

package.json

 {
   "name": "@stackflow/plugin-history-sync",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "license": "MIT",
@@ -24,12 +24,26 @@ "exports": {
     "clean": "rimraf dist",
-    "dev": "yarn build:js --watch && yarn build:dts --watch"
+    "dev": "yarn build:js --watch && yarn build:dts --watch && yarn test --watch",
+    "test": "yarn jest"
   },
+  "jest": {
+    "coveragePathIgnorePatterns": [
+      "index.ts",
+      "index.tsx"
+    ],
+    "transform": {
+      "^.+\\.(t|j)sx?$": "@swc/jest"
+    }
+  },
   "dependencies": {
+    "history": "^5.3.0",
     "url-pattern": "^1.0.3"
   },
   "devDependencies": {
-    "@stackflow/core": "^1.0.1",
+    "@stackflow/core": "^1.0.2",
     "@stackflow/esbuild-config": "^1.0.0",
     "@stackflow/eslint-config": "^1.0.0",
-    "@stackflow/react": "^1.0.1",
+    "@stackflow/react": "^1.0.2",
+    "@swc/core": "^1.3.35",
+    "@swc/jest": "^0.2.24",
+    "@types/jest": "^29.4.0",
     "@types/node": "^18.6.3",
@@ -49,2 +63,3 @@ "@types/react": "^18.0.10",
     "eslint-plugin-simple-import-sort": "^7.0.0",
+    "jest": "^29.4.2",
     "react": "^18.1.0",
@@ -69,3 +84,3 @@ "rimraf": "^3.0.2",
   },
-  "gitHead": "b102bb6327baf58ab60329d91dacfb1b0aad12c7"
+  "gitHead": "cc3a51069c36de7d1b9cf6c0f40d92acda5950a2"
 }

src/historyState.ts

 import type { Activity, ActivityStep } from "@stackflow/core";
+import type { History } from "history";
 
-import { isServer } from "./utils";
-
 const STATE_TAG = `${process.env.PACKAGE_NAME}@${process.env.PACKAGE_VERSION}`;
@@ -11,2 +10,3 @@
 }
+
 interface SerializedState extends State {
@@ -16,26 +16,2 @@ _TAG: typeof STATE_TAG;
 
-export function getCurrentState(): unknown {
-  if (isServer()) {
-    return null;
-  }
-
-  return window.history.state;
-}
-
-export function parseState(state: unknown): State | null {
-  const _state: any = state;
-
-  if (
-    typeof _state === "object" &&
-    _state !== null &&
-    "_TAG" in _state &&
-    typeof _state._TAG === "string" &&
-    _state._TAG === STATE_TAG
-  ) {
-    return state as State;
-  }
-
-  return null;
-}
-
 function serializeStep(step: ActivityStep): ActivityStep {
@@ -76,32 +52,56 @@ return {
 
+export function safeParseState(state: unknown): State | null {
+  const _state: any = state;
+
+  if (
+    typeof _state === "object" &&
+    _state !== null &&
+    "_TAG" in _state &&
+    typeof _state._TAG === "string" &&
+    _state._TAG === STATE_TAG
+  ) {
+    return state as State;
+  }
+
+  return null;
+}
+
+export function getCurrentState({ history }: { history: History }): unknown {
+  return history.location.state;
+}
+
 export function pushState({
+  history,
+  pathname,
   state,
-  url,
   useHash,
 }: {
+  history: History;
+  pathname: string;
   state: State;
-  url: string;
   useHash?: boolean;
 }) {
-  if (isServer()) {
-    return;
-  }
-  const nextUrl = useHash ? `${window.location.pathname}#${url}` : url;
-  window.history.pushState(serializeState(state), "", nextUrl);
+  const nextPathname = useHash
+    ? `${history.location.pathname}#${pathname}`
+    : pathname;
+
+  history.push(nextPathname, serializeState(state));
 }
 
 export function replaceState({
-  url,
+  history,
+  pathname,
   state,
   useHash,
 }: {
-  url: string;
+  history: History;
+  pathname: string;
   state: State;
   useHash?: boolean;
 }) {
-  if (isServer()) {
-    return;
-  }
-  const nextUrl = useHash ? `${window.location.pathname}#${url}` : url;
-  window.history.replaceState(serializeState(state), "", nextUrl);
+  const nextPathname = useHash
+    ? `${history.location.pathname}#${pathname}`
+    : pathname;
+
+  history.replace(nextPathname, serializeState(state));
 }

src/makeTemplate.ts

@@ -39,3 +39,3 @@ import UrlPattern from "url-pattern";
       const pathname = pattern.stringify(params);
-      const pathParams = pattern.match(pathname) ?? {};
+      const pathParams = pattern.match(pathname);
 
@@ -42,0 +42,0 @@ const searchParamsMap = { ...params };

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

127651

increased by16.75%

Number of package files

29

increased by7.41%

Lines of code

2182

increased by35.19%

Worsened metrics

Dependency count

6

increased by20%

Dev dependency count

25

increased by19.05%

Dependency changes

• + Addedhistory@^5.3.0