@stackflow/react - npm Package Compare versions

Comparing version 0.21.3 to 1.0.0

dist/activity/ActivityComponentType.d.ts

@@ -1,2 +0,2 @@
-import type React from "react";
+/// <reference types="react" />
 export declare type ActivityComponentType<T extends {
@@ -3,0 +3,0 @@ [K in keyof T]: string | undefined;

dist/core/CoreProvider.d.ts

@@ -0,5 +1,5 @@
+/// <reference types="react" />
 import type { CoreStore, Stack } from "@stackflow/core";
-import React from "react";
-export declare const CoreActionsContext: React.Context<import("@stackflow/core").StackflowActions>;
-export declare const CoreStateContext: React.Context<Stack>;
+export declare const CoreActionsContext: import("react").Context<import("@stackflow/core").StackflowActions>;
+export declare const CoreStateContext: import("react").Context<Stack>;
 export interface CoreProviderProps {
@@ -6,0 +6,0 @@ coreStore: CoreStore;

dist/index.js

@@ -38,2 +38,6 @@ "use strict";
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
@@ -63,4 +67,14 @@ mod
 // src/activity/ActivityProvider.tsx
-var import_react2 = __toESM(require("react"));
+var import_react2 = require("react");
 
+// src/utils/isServer.ts
+function isServer() {
+  return typeof window === "undefined";
+}
+
+// src/utils/isBrowser.ts
+function isBrowser() {
+  return !isServer();
+}
+
 // src/utils/makeRef.ts
@@ -80,2 +94,6 @@ function makeRef() {
 
+// src/utils/noop.ts
+var noop = () => {
+};
+
 // src/utils/useMemoDeep.ts
@@ -97,2 +115,3 @@ var import_react = require("react");
 // src/activity/ActivityProvider.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
 var ActivityContext = (0, import_react2.createContext)(null);
@@ -102,5 +121,3 @@ var ActivityProvider = ({
   value
-}) => /* @__PURE__ */ import_react2.default.createElement(ActivityContext.Provider, {
-  value: useMemoDeep(value)
-}, children);
+}) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ActivityContext.Provider, { value: useMemoDeep(value), children });
 ActivityProvider.displayName = "ActivityProvider";
@@ -121,3 +138,4 @@
 // src/stack/StackProvider.tsx
-var import_react5 = __toESM(require("react"));
+var import_react5 = require("react");
+var import_jsx_runtime2 = require("react/jsx-runtime");
 var StackContext = (0, import_react5.createContext)(null);
@@ -127,5 +145,3 @@ var StackProvider = ({
   value
-}) => /* @__PURE__ */ import_react5.default.createElement(StackContext.Provider, {
-  value: useMemoDeep(value)
-}, children);
+}) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(StackContext.Provider, { value: useMemoDeep(value), children });
 StackProvider.displayName = "StackProvider";
@@ -138,3 +154,3 @@
 var import_core7 = require("@stackflow/core");
-var import_react19 = __toESM(require("react"));
+var import_react18 = require("react");
 
@@ -154,3 +170,3 @@ // src/activity/makeActivityId.ts
 // src/core/CoreProvider.tsx
-var import_react10 = __toESM(require("react"));
+var import_react10 = require("react");
 
@@ -182,2 +198,3 @@ // src/shims/useDeferredValue.ts
 // src/core/CoreProvider.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
 var CoreActionsContext = (0, import_react10.createContext)(
@@ -197,7 +214,3 @@ null
   const deferredStack = useDeferredValue(stack);
-  return /* @__PURE__ */ import_react10.default.createElement(CoreStateContext.Provider, {
-    value: deferredStack
-  }, /* @__PURE__ */ import_react10.default.createElement(CoreActionsContext.Provider, {
-    value: coreStore.actions
-  }, children));
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CoreStateContext.Provider, { value: deferredStack, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CoreActionsContext.Provider, { value: coreStore.actions, children }) });
 };
@@ -207,17 +220,15 @@ CoreProvider.displayName = "CoreProvider";
 // src/core/useCoreActions.ts
-var import_react11 = __toESM(require("react"));
-var useCoreActions = () => import_react11.default.useContext(CoreActionsContext);
+var import_react11 = require("react");
+var useCoreActions = () => (0, import_react11.useContext)(CoreActionsContext);
 
 // src/core/useCoreState.ts
-var import_react12 = __toESM(require("react"));
-var useCoreState = () => import_react12.default.useContext(CoreStateContext);
+var import_react12 = require("react");
+var useCoreState = () => (0, import_react12.useContext)(CoreStateContext);
 
 // src/MainRenderer.tsx
-var import_react16 = __toESM(require("react"));
+var import_react15 = require("react");
 
-// src/PluginRenderer.tsx
-var import_react15 = __toESM(require("react"));
-
 // src/plugins/PluginsProvider.tsx
-var import_react13 = __toESM(require("react"));
+var import_react13 = require("react");
+var import_jsx_runtime4 = require("react/jsx-runtime");
 var PluginsContext = (0, import_react13.createContext)(null);
@@ -227,5 +238,3 @@ var PluginsProvider = ({
   value
-}) => /* @__PURE__ */ import_react13.default.createElement(PluginsContext.Provider, {
-  value
-}, children);
+}) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(PluginsContext.Provider, { value, children });
 PluginsProvider.displayName = "PluginsProvider";
@@ -240,2 +249,3 @@
 // src/PluginRenderer.tsx
+var import_jsx_runtime5 = require("react/jsx-runtime");
 var PluginRenderer = ({
@@ -256,5 +266,3 @@ activityComponentMap,
               const Activity = activityComponentMap[activity.name];
-              let output = /* @__PURE__ */ import_react15.default.createElement(Activity, {
-                params: activity.params
-              });
+              let output = /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Activity, { params: activity.params });
               plugins.forEach((p) => {
@@ -268,8 +276,10 @@ var _a4, _b;
               });
-              return /* @__PURE__ */ import_react15.default.createElement(StackProvider, {
-                value: stack
-              }, /* @__PURE__ */ import_react15.default.createElement(ActivityProvider, {
-                key: activity.id,
-                value: __spreadValues(__spreadValues({}, activity), overrideActivity)
-              }, output));
+              return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(StackProvider, { value: stack, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+                ActivityProvider,
+                {
+                  value: __spreadValues(__spreadValues({}, activity), overrideActivity),
+                  children: output
+                },
+                activity.id
+              ) });
             }
@@ -286,2 +296,3 @@ }))
 // src/MainRenderer.tsx
+var import_jsx_runtime6 = require("react/jsx-runtime");
 var MainRenderer = ({
@@ -295,3 +306,3 @@ activityComponentMap
   );
-  (0, import_react16.useEffect)(() => {
+  (0, import_react15.useEffect)(() => {
     if (renderingPlugins.length === 0) {
@@ -303,7 +314,10 @@ console.warn(
   }, [renderingPlugins]);
-  let output = /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, renderingPlugins.map((plugin) => /* @__PURE__ */ import_react16.default.createElement(PluginRenderer_default, {
-    key: plugin.key,
-    activityComponentMap,
-    plugin
-  })));
+  let output = /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_jsx_runtime6.Fragment, { children: renderingPlugins.map((plugin) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    PluginRenderer_default,
+    {
+      activityComponentMap,
+      plugin
+    },
+    plugin.key
+  )) });
   plugins.forEach((plugin) => {
@@ -325,3 +339,3 @@ var _a4, _b;
 // src/useActions.ts
-var import_react17 = require("react");
+var import_react16 = require("react");
 function parseActionOptions(options) {
@@ -340,3 +354,3 @@ if (!options) {
   const [pending] = useTransition();
-  return (0, import_react17.useMemo)(
+  return (0, import_react16.useMemo)(
     () => ({
@@ -369,6 +383,19 @@ pending,
       },
-      pop(options) {
-        coreActions == null ? void 0 : coreActions.pop({
-          skipExitActiveState: parseActionOptions(options).skipActiveState
-        });
+      pop(count, options) {
+        let _count = 1;
+        let _options = {};
+        if (typeof count === "object") {
+          _options = __spreadValues({}, count);
+        }
+        if (typeof count === "number") {
+          _count = count;
+        }
+        if (options) {
+          _options = __spreadValues({}, options);
+        }
+        for (let i = 0; i < _count; i += 1) {
+          coreActions == null ? void 0 : coreActions.pop({
+            skipExitActiveState: i === 0 ? parseActionOptions(_options).skipActiveState : true
+          });
+        }
       }
@@ -381,7 +408,7 @@ }),
 // src/useStepActions.ts
-var import_react18 = require("react");
+var import_react17 = require("react");
 var useStepActions = () => {
   const coreActions = useCoreActions();
   const [pending] = useTransition();
-  return (0, import_react18.useMemo)(
+  return (0, import_react17.useMemo)(
     () => ({
@@ -417,3 +444,3 @@ pending,
 // src/stackflow.tsx
-var isBrowser = typeof window !== "undefined";
+var import_jsx_runtime7 = require("react/jsx-runtime");
 function parseActionOptions2(options) {
@@ -431,9 +458,2 @@ if (!options) {
   var _a4;
-  if (typeof window !== "undefined") {
-    const html = window.document.documentElement;
-    html.style.setProperty(
-      "--stackflow-transition-duration",
-      `${options.transitionDuration}ms`
-    );
-  }
   const plugins = ((_a4 = options.plugins) != null ? _a4 : []).flat(Infinity).map((p) => p);
@@ -443,3 +463,3 @@ const pluginInstances = plugins.map((plugin) => plugin());
     (acc, [key, Activity]) => __spreadProps(__spreadValues({}, acc), {
-      [key]: "component" in Activity ? import_react19.default.memo(Activity.component) : import_react19.default.memo(Activity)
+      [key]: "component" in Activity ? (0, import_react18.memo)(Activity.component) : (0, import_react18.memo)(Activity)
     }),
@@ -467,6 +487,6 @@ {}
   const [getCoreStore, setCoreStore] = makeRef();
-  const Stack = import_react19.default.memo((props) => {
-    const coreStore = (0, import_react19.useMemo)(() => {
+  const Stack = (0, import_react18.memo)((props) => {
+    const coreStore = (0, import_react18.useMemo)(() => {
       const prevCoreStore = getCoreStore();
-      if (isBrowser && prevCoreStore) {
+      if (isBrowser() && prevCoreStore) {
         return prevCoreStore;
@@ -511,3 +531,3 @@ }
       });
-      if (isBrowser) {
+      if (isBrowser()) {
         store.init();
@@ -518,9 +538,3 @@ setCoreStore(store);
     }, []);
-    return /* @__PURE__ */ import_react19.default.createElement(PluginsProvider, {
-      value: pluginInstances
-    }, /* @__PURE__ */ import_react19.default.createElement(CoreProvider, {
-      coreStore
-    }, /* @__PURE__ */ import_react19.default.createElement(MainRenderer_default, {
-      activityComponentMap
-    })));
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(PluginsProvider, { value: pluginInstances, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CoreProvider, { coreStore, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(MainRenderer_default, { activityComponentMap }) }) });
   });
@@ -540,3 +554,3 @@ Stack.displayName = "Stack";
       }
-      activityComponentMap[activity.name] = import_react19.default.memo(activity.component);
+      activityComponentMap[activity.name] = (0, import_react18.memo)(activity.component);
       staticCoreStore.actions.dispatchEvent("ActivityRegistered", {
@@ -595,7 +609,20 @@ activityName: activity.name,
       },
-      pop(options2) {
+      pop(count, options2) {
         var _a5;
-        return (_a5 = getCoreStore()) == null ? void 0 : _a5.actions.pop({
-          skipExitActiveState: parseActionOptions2(options2).skipActiveState
-        });
+        let _count = 1;
+        let _options = {};
+        if (typeof count === "object") {
+          _options = __spreadValues({}, count);
+        }
+        if (typeof count === "number") {
+          _count = count;
+        }
+        if (options2) {
+          _options = __spreadValues({}, options2);
+        }
+        for (let i = 0; i < _count; i += 1) {
+          (_a5 = getCoreStore()) == null ? void 0 : _a5.actions.pop({
+            skipExitActiveState: i === 0 ? parseActionOptions2(_options).skipActiveState : true
+          });
+        }
       },
@@ -627,8 +654,6 @@ stepPush(params) {
 // src/useActiveEffect.ts
-var import_react20 = require("react");
-var noop = () => {
-};
+var import_react19 = require("react");
 var useActiveEffect = (effect) => {
   const { isActive } = useActivity();
-  (0, import_react20.useEffect)(() => {
+  (0, import_react19.useEffect)(() => {
     if (isActive) {
@@ -642,12 +667,10 @@ return effect();
 // src/useEnterDoneEffect.ts
-var import_react21 = require("react");
-var noop2 = () => {
-};
+var import_react20 = require("react");
 var useEnterDoneEffect = (effect, deps = []) => {
   const { isTop, transitionState } = useActivity();
-  (0, import_react21.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     if (isTop && transitionState === "enter-done") {
       return effect();
     }
-    return noop2;
+    return noop;
   }, [isTop, transitionState, ...deps]);
@@ -657,8 +680,8 @@ };
 // src/useStep.ts
-var import_react22 = require("react");
+var import_react21 = require("react");
 function useStep() {
   var _a4;
-  const { steps, id: id3 } = (0, import_react22.useContext)(ActivityContext);
+  const { steps, id: id3 } = (0, import_react21.useContext)(ActivityContext);
   return (_a4 = steps.filter((step) => step.id !== id3).at(-1)) != null ? _a4 : null;
 }
 //# sourceMappingURL=index.js.map

dist/MainRenderer.d.ts

@@ -1,2 +0,2 @@
-import React from "react";
+/// <reference types="react" />
 import type { ActivityComponentType } from "./activity";
@@ -3,0 +3,0 @@ interface MainRendererProps {

dist/PluginRenderer.d.ts

@@ -1,2 +0,2 @@
-import React from "react";
+/// <reference types="react" />
 import type { ActivityComponentType } from "./activity";
@@ -3,0 +3,0 @@ import type { StackflowReactPlugin } from "./StackflowReactPlugin";

dist/stack/StackProvider.d.ts

@@ -0,4 +1,4 @@
+/// <reference types="react" />
 import type { Stack } from "@stackflow/core";
-import React from "react";
-export declare const StackContext: React.Context<Stack>;
+export declare const StackContext: import("react").Context<Stack>;
 interface StackProviderProps {
@@ -5,0 +5,0 @@ children: React.ReactNode;

dist/stackflow.d.ts

@@ -0,3 +1,3 @@
+/// <reference types="react" />
 import type { ActivityRegisteredEvent, StackflowActions } from "@stackflow/core";
-import React from "react";
 import type { ActivityComponentType } from "./activity";
@@ -4,0 +4,0 @@ import type { BaseActivities } from "./BaseActivities";

dist/StackflowReactPlugin.d.ts

@@ -0,3 +1,3 @@
+/// <reference types="react" />
 import type { Activity, Stack, StackflowPlugin } from "@stackflow/core";
-import type React from "react";
 export declare type StackflowReactPlugin<T = never> = () => {
@@ -4,0 +4,0 @@ /**

dist/useActions.d.ts

@@ -11,7 +11,7 @@ import type { ActivityComponentType } from "./activity";
      */
-    push: <K extends Extract<keyof T, string>>(activityName: K, params: T[K] extends ActivityComponentType<infer U> | {
+    push<K extends Extract<keyof T, string>>(activityName: K, params: T[K] extends ActivityComponentType<infer U> | {
         component: ActivityComponentType<infer U>;
     } ? U : {}, options?: {
         animate?: boolean;
-    }) => {
+    }): {
         activityId: string;
@@ -22,3 +22,3 @@ };
      */
-    replace: <K extends Extract<keyof T, string>>(activityName: K, params: T[K] extends ActivityComponentType<infer U> | {
+    replace<K extends Extract<keyof T, string>>(activityName: K, params: T[K] extends ActivityComponentType<infer U> | {
         component: ActivityComponentType<infer U>;
@@ -28,3 +28,3 @@ } ? U : {}, options?: {
         activityId?: string;
-    }) => {
+    }): {
         activityId: string;
@@ -35,6 +35,10 @@ };
      */
-    pop: (options?: {
+    pop(): void;
+    pop(options: {
         animate?: boolean;
-    }) => void;
+    }): void;
+    pop(count: number, options?: {
+        animate?: boolean;
+    }): void;
 };
 export declare function useActions<T extends BaseActivities>(): UseActionsOutputType<T>;

dist/utils/index.d.ts

@@ -0,3 +1,6 @@
+export * from "./isBrowser";
+export * from "./isServer";
 export * from "./makeRef";
+export * from "./noop";
 export * from "./useMemoDeep";
 export * from "./WithRequired";

package.json

 {
   "name": "@stackflow/react",
-  "version": "0.21.3",
+  "version": "1.0.0",
   "license": "MIT",
@@ -30,5 +30,5 @@ "exports": {
   "devDependencies": {
-    "@stackflow/core": "^0.21.1",
+    "@stackflow/core": "^1.0.0",
     "@stackflow/esbuild-config": "^0.20.0",
-    "@stackflow/eslint-config": "^0.20.0",
+    "@stackflow/eslint-config": "^1.0.0",
     "@types/react": "^18.0.9",
@@ -65,3 +65,3 @@ "@typescript-eslint/eslint-plugin": "^5.32.0",
   },
-  "gitHead": "49e9bc061fc8f716489a3acad6d922d0476ee94e"
+  "gitHead": "d96a0b26503473cb0f246e8cf137a231d1f1eda3"
 }

src/core/useCoreActions.ts

@@ -1,5 +0,5 @@
-import React from "react";
+import { useContext } from "react";
 
 import { CoreActionsContext } from "./CoreProvider";
 
-export const useCoreActions = () => React.useContext(CoreActionsContext);
+export const useCoreActions = () => useContext(CoreActionsContext);

src/core/useCoreState.ts

@@ -1,5 +0,5 @@
-import React from "react";
+import { useContext } from "react";
 
 import { CoreStateContext } from "./CoreProvider";
 
-export const useCoreState = () => React.useContext(CoreStateContext);
+export const useCoreState = () => useContext(CoreStateContext);

src/StackflowReactPlugin.ts

 import type { Activity, Stack, StackflowPlugin } from "@stackflow/core";
-import type React from "react";
 
@@ -4,0 +3,0 @@ export type StackflowReactPlugin<T = never> = () => {

src/useActions.ts

@@ -1,2 +0,2 @@
-import React, { useMemo } from "react";
+import { useMemo } from "react";
 
@@ -32,3 +32,3 @@ import type { ActivityComponentType } from "./activity";
    */
-  push: <K extends Extract<keyof T, string>>(
+  push<K extends Extract<keyof T, string>>(
     activityName: K,
@@ -43,3 +43,3 @@ params: T[K] extends
     },
-  ) => {
+  ): {
     activityId: string;
@@ -51,3 +51,3 @@ };
    */
-  replace: <K extends Extract<keyof T, string>>(
+  replace<K extends Extract<keyof T, string>>(
     activityName: K,
@@ -63,3 +63,3 @@ params: T[K] extends
     },
-  ) => {
+  ): {
     activityId: string;
@@ -71,3 +71,5 @@ };
    */
-  pop: (options?: { animate?: boolean }) => void;
+  pop(): void;
+  pop(options: { animate?: boolean }): void;
+  pop(count: number, options?: { animate?: boolean }): void;
 };
@@ -112,6 +114,29 @@
       },
-      pop(options) {
-        coreActions?.pop({
-          skipExitActiveState: parseActionOptions(options).skipActiveState,
-        });
+      pop(
+        count?: number | { animate?: boolean } | undefined,
+        options?: { animate?: boolean } | undefined,
+      ) {
+        let _count = 1;
+        let _options: { animate?: boolean } = {};
+
+        if (typeof count === "object") {
+          _options = {
+            ...count,
+          };
+        }
+        if (typeof count === "number") {
+          _count = count;
+        }
+        if (options) {
+          _options = {
+            ...options,
+          };
+        }
+
+        for (let i = 0; i < _count; i += 1) {
+          coreActions?.pop({
+            skipExitActiveState:
+              i === 0 ? parseActionOptions(_options).skipActiveState : true,
+          });
+        }
       },
@@ -118,0 +143,0 @@ }),

src/useActiveEffect.ts

 import { useEffect } from "react";
 
 import { useActivity } from "./activity/useActivity";
+import { noop } from "./utils";
 
-const noop = () => {};
-
 export const useActiveEffect = (effect: React.EffectCallback) => {
@@ -8,0 +7,0 @@ const { isActive } = useActivity();

src/useEnterDoneEffect.ts

 import { useEffect } from "react";
 
 import { useActivity } from "./activity/useActivity";
+import { noop } from "./utils";
 
-const noop = () => {};
-
 export const useEnterDoneEffect = (
@@ -8,0 +7,0 @@ effect: React.EffectCallback,

src/useStepActions.ts

@@ -1,2 +0,2 @@
-import React, { useMemo } from "react";
+import { useMemo } from "react";
 
@@ -3,0 +3,0 @@ import type { ActivityComponentType } from "./activity";

src/utils/index.ts

@@ -0,3 +1,6 @@
+export * from "./isBrowser";
+export * from "./isServer";
 export * from "./makeRef";
+export * from "./noop";
 export * from "./useMemoDeep";
 export * from "./WithRequired";

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

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

163777

increased by4.46%

Number of package files

85

increased by7.59%

Lines of code

2451

increased by4.52%

Number of low quality alerts

1

decreased by-50%

No dependency changes