@ahnseungchan/webviewkit 1.0.7 → 1.2.0

package/dist/packages/core/src/__tests__/stack-router.test.js

@@ -1,185 +0,0 @@
-"use strict";
-// import React from "react";
-// import {
-//   render,
-//   screen,
-//   fireEvent,
-//   act,
-//   waitFor,
-// } from "@testing-library/react";
-// import StackRouter, {
-//   useStackRouter,
-// } from "../stack-router/stack-router-provider";
-// import { history } from "../history";
-// // Test component that uses useStackRouter
-// const MockPushComponent = ({ path }: { path: string }) => {
-//   const { push } = useStackRouter();
-//   return (
-//     <button
-//       onClick={() => push(path)}
-//       data-testid={`push-to-${path.replace("/", "")}`}
-//     >
-//       Navigate to {path}
-//     </button>
-//   );
-// };
-// const MockBackComponent = ({ path }: { path: string }) => {
-//   const { back } = useStackRouter();
-//   return (
-//     <button onClick={back} data-testid={`back-to-${path.replace("/", "")}`}>
-//       Back
-//     </button>
-//   );
-// };
-// // Mock components for testing
-// const MockPage1 = () => (
-//   <div data-testid="page1">
-//     <MockPushComponent path="/page2" />
-//     Page1
-//   </div>
-// );
-// const MockPage2 = () => (
-//   <div data-testid="page2">
-//     <MockPushComponent path="/page3" />
-//     <MockBackComponent path="/page1" />
-//     Page2
-//   </div>
-// );
-// const MockPage3 = () => (
-//   <div data-testid="page3">
-//     <MockBackComponent path="/page2" />
-//     Page3
-//   </div>
-// );
-// const mockActivities = [
-//   { path: "/page1", element: <MockPage1 /> },
-//   { path: "/page2", element: <MockPage2 /> },
-//   { path: "/page3", element: <MockPage3 /> },
-// ];
-// // Helper function to wait for animations and state updates
-// const waitForStateUpdate = async () => {
-//   await act(async () => {
-//     await new Promise((resolve) => setTimeout(resolve, 100));
-//   });
-// };
-// describe("StackRouter", () => {
-//   it("renders initial page correctly", () => {
-//     render(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//       />
-//     );
-//     expect(screen.getByTestId("page1")).toBeInTheDocument();
-//   });
-//   it("navigates to new page when push is called", async () => {
-//     render(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//       />
-//     );
-//     // Click the navigation button
-//     await act(async () => {
-//       fireEvent.click(screen.getByTestId("push-to-page2"));
-//       await waitForStateUpdate();
-//     });
-//     await waitFor(() => {
-//       expect(screen.getByText("Page2")).toBeInTheDocument();
-//     });
-//   });
-//   it("goes back when back is called", async () => {
-//     render(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//       />
-//     );
-//     // First push to page2
-//     await act(async () => {
-//       fireEvent.click(screen.getByTestId("push-to-page2"));
-//       await waitForStateUpdate();
-//     });
-//     // Then go back
-//     await act(async () => {
-//       fireEvent.click(screen.getByTestId("back-to-page1"));
-//       await waitForStateUpdate();
-//     });
-//     await waitFor(() => {
-//       expect(screen.getByText("Page1")).toBeInTheDocument();
-//     });
-//   });
-//   it("handles multiple page transitions correctly", async () => {
-//     render(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//       />
-//     );
-//     // Navigate through pages
-//     await act(async () => {
-//       fireEvent.click(screen.getByTestId("push-to-page2"));
-//       await waitForStateUpdate();
-//     });
-//     await waitFor(() => {
-//       expect(screen.getByText("Page2")).toBeInTheDocument();
-//     });
-//     await act(async () => {
-//       fireEvent.click(screen.getByTestId("push-to-page3"));
-//       await waitForStateUpdate();
-//     });
-//     await waitFor(() => {
-//       expect(screen.getByText("Page3")).toBeInTheDocument();
-//     });
-//     // Go back twice
-//     await act(async () => {
-//       fireEvent.click(screen.getByTestId("back-to-page2"));
-//       await waitForStateUpdate();
-//     });
-//     await waitFor(() => {
-//       expect(screen.getByText("Page2")).toBeInTheDocument();
-//     });
-//     await act(async () => {
-//       fireEvent.click(screen.getByTestId("back-to-page1"));
-//       await waitForStateUpdate();
-//     });
-//     await waitFor(() => {
-//       expect(screen.getByText("Page1")).toBeInTheDocument();
-//     });
-//   });
-//   it("maintains correct page order in stack", async () => {
-//     const { rerender } = render(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//       />
-//     );
-//     // Navigate to page2
-//     await act(async () => {
-//       fireEvent.click(screen.getByTestId("push-to-page2"));
-//       await waitForStateUpdate();
-//     });
-//     await waitFor(() => {
-//       expect(screen.getByText("Page2")).toBeInTheDocument();
-//     });
-//     // Navigate to page3
-//     await act(async () => {
-//       fireEvent.click(screen.getByTestId("push-to-page3"));
-//       await waitForStateUpdate();
-//     });
-//     await waitFor(() => {
-//       expect(screen.getByText("Page3")).toBeInTheDocument();
-//     });
-//   });
-//   it("handles maxWidth prop correctly", () => {
-//     render(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//         maxWidth="800px"
-//       />
-//     );
-//     const layout = screen.getByTestId("layout");
-//     expect(layout).toHaveStyle({ maxWidth: "800px" });
-//   });
-// });

package/dist/packages/core/src/history.js

@@ -1,82 +0,0 @@
-import { HistoryAction } from "./type";
-const listeners = new Set();
-const handlePopState = (event) => {
-    const state = event.state;
-    notifyListeners(state);
-};
-// notify to listeners
-const notifyListeners = (state) => {
-    listeners.forEach((listener) => listener(state));
-};
-// initialize
-window.addEventListener("popstate", handlePopState);
-export const history = {
-    // add new history entry
-    push: async (path, data) => {
-        const state = {
-            path,
-            data,
-            action: HistoryAction.PUSH,
-        };
-        window.history.pushState(state, "", path);
-        // 애니메이션을 위한 지연
-        await new Promise((resolve) => setTimeout(resolve, 300));
-        notifyListeners(state);
-    },
-    // replace current history entry
-    replace: async (path, data) => {
-        const state = {
-            path,
-            data,
-            action: HistoryAction.REPLACE,
-        };
-        window.history.replaceState(state, "", path);
-        await new Promise((resolve) => setTimeout(resolve, 300));
-        notifyListeners(state);
-    },
-    // back to previous history entry
-    back: async () => {
-        window.history.back();
-        await new Promise((resolve) => {
-            const handlePopState = () => {
-                window.removeEventListener("popstate", handlePopState);
-                resolve();
-            };
-            window.addEventListener("popstate", handlePopState);
-        });
-        const state = {
-            path: window.location.pathname,
-            action: HistoryAction.POP,
-        };
-        notifyListeners(state);
-    },
-    // forward to next history entry
-    forward: async () => {
-        window.history.forward();
-        const state = {
-            path: window.location.pathname,
-            action: HistoryAction.PUSH,
-        };
-        await new Promise((resolve) => setTimeout(resolve, 300));
-        notifyListeners(state);
-    },
-    // go to specific history entry
-    go: async (delta) => {
-        window.history.go(delta);
-        const state = {
-            path: window.location.pathname,
-            action: HistoryAction.PUSH,
-        };
-        await new Promise((resolve) => setTimeout(resolve, 300));
-        notifyListeners(state);
-    },
-    // get current history entry
-    getCurrentState: () => window.history.state || {
-        path: window.location.pathname,
-    },
-    // change listener to history
-    addListener: (listener) => {
-        listeners.add(listener);
-        return () => listeners.delete(listener);
-    },
-};

package/dist/packages/core/src/index.d.ts

@@ -1,5 +0,0 @@
-export type { StackRouterProviderProps, VisiblePage, DirectionType, HistoryState, HistoryListener, } from "./type";
-export { Direction, HistoryAction } from "./type";
-export { history } from "./history";
-export { default as StackRouterProvider } from "./stack-router/stack-router-provider";
-export { useStackRouter } from "./stack-router/stack-router-provider";

package/dist/packages/core/src/index.js

@@ -1,6 +0,0 @@
-export { Direction, HistoryAction } from "./type";
-// Export history API
-export { history } from "./history";
-// Export stack router components
-export { default as StackRouterProvider } from "./stack-router/stack-router-provider";
-export { useStackRouter } from "./stack-router/stack-router-provider";

package/dist/packages/core/src/stack-router/__tests__/stack-router.test.js

@@ -1,153 +0,0 @@
-"use strict";
-// import React from "react";
-// import { render, screen, fireEvent, act } from "@testing-library/react";
-// import StackRouter from "../stack-router-provider";
-// import { history } from "../../history";
-// // Mock components for testing
-// const MockPage1 = () => <div data-testid="page1">Page 1</div>;
-// const MockPage2 = () => <div data-testid="page2">Page 2</div>;
-// const MockPage3 = () => <div data-testid="page3">Page 3</div>;
-// const mockActivities = [
-//   { path: "/page1", element: <MockPage1 /> },
-//   { path: "/page2", element: <MockPage2 /> },
-//   { path: "/page3", element: <MockPage3 /> },
-// ];
-// // Helper function to wait for animations
-// const waitForAnimation = async () => {
-//   await act(async () => {
-//     await new Promise((resolve) => setTimeout(resolve, 700)); // 애니메이션 시간과 동일하게 설정
-//   });
-// };
-// describe("StackRouter", () => {
-//   beforeEach(() => {
-//     // Reset history before each test
-//     history.push("/page1");
-//   });
-//   it("renders initial page correctly", () => {
-//     render(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//       />
-//     );
-//     expect(screen.getByTestId("page1")).toBeInTheDocument();
-//   });
-//   it("navigates to new page when push is called", async () => {
-//     const { rerender } = render(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//       />
-//     );
-//     // Mock history.push
-//     history.push("/page2");
-//     // Wait for animation
-//     await waitForAnimation();
-//     rerender(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//       />
-//     );
-//     // 페이지가 렌더링될 때까지 대기
-//     await screen.findByTestId("page2");
-//     expect(screen.getByTestId("page2")).toBeInTheDocument();
-//   });
-//   it("goes back when back is called", async () => {
-//     const { rerender } = render(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//       />
-//     );
-//     // First push to page2
-//     history.push("/page2");
-//     await waitForAnimation();
-//     // Then go back
-//     history.back();
-//     await waitForAnimation();
-//     rerender(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//       />
-//     );
-//     // 페이지가 렌더링될 때까지 대기
-//     await screen.findByTestId("page1");
-//     expect(screen.getByTestId("page1")).toBeInTheDocument();
-//   });
-//   it("handles multiple page transitions correctly", async () => {
-//     const { rerender } = render(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//       />
-//     );
-//     // Navigate through pages
-//     history.push("/page2");
-//     await waitForAnimation();
-//     history.push("/page3");
-//     await waitForAnimation();
-//     rerender(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//       />
-//     );
-//     // 페이지가 렌더링될 때까지 대기
-//     await screen.findByTestId("page3");
-//     expect(screen.getByTestId("page3")).toBeInTheDocument();
-//     // Go back twice
-//     history.back();
-//     await waitForAnimation();
-//     history.back();
-//     await waitForAnimation();
-//     rerender(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//       />
-//     );
-//     // 페이지가 렌더링될 때까지 대기
-//     await screen.findByTestId("page1");
-//     expect(screen.getByTestId("page1")).toBeInTheDocument();
-//   });
-//   it("maintains correct page order in stack", async () => {
-//     const { rerender } = render(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//       />
-//     );
-//     // Navigate to page2
-//     history.push("/page2");
-//     await waitForAnimation();
-//     // Navigate to page3
-//     history.push("/page3");
-//     await waitForAnimation();
-//     rerender(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//       />
-//     );
-//     // 모든 페이지가 렌더링될 때까지 대기
-//     await screen.findByTestId("page3");
-//     // Check if all pages are in the correct order
-//     const pages = screen.getAllByTestId(/page[1-3]/);
-//     expect(pages[0]).toHaveTextContent("Page 1");
-//     expect(pages[1]).toHaveTextContent("Page 2");
-//     expect(pages[2]).toHaveTextContent("Page 3");
-//   });
-//   it("handles maxWidth prop correctly", () => {
-//     const { container } = render(
-//       <StackRouter
-//         initialActivity={{ path: "/page1", element: <MockPage1 /> }}
-//         Activities={mockActivities}
-//         maxWidth="800px"
-//       />
-//     );
-//     const layout = container.querySelector('div[style*="max-width: 800px"]');
-//     expect(layout).toBeInTheDocument();
-//   });
-// });

package/dist/packages/core/src/stack-router/_components/back-router.d.ts

@@ -1,2 +0,0 @@
-declare const BackRouter: () => import("react/jsx-runtime").JSX.Element;
-export default BackRouter;

package/dist/packages/core/src/stack-router/_components/back-router.js

@@ -1,34 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import styled from "@emotion/styled";
-import { useStackRouter } from "../stack-router-provider";
-const BackRouter = () => {
-    const { back } = useStackRouter();
-    return (_jsx(BackButton, { onClick: back, children: _jsx(BackIcon, {}) }));
-};
-export default BackRouter;
-/**
- styles
- */
-const BackButton = styled.button `
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 40px;
-  height: 40px;
-  border: none;
-  background: none;
-  cursor: pointer;
-  padding: 8px;
-  border-radius: 50%;
-  transition: all 0.2s;
-  color: #000000;
-
-  &:hover {
-    color: #666666;
-  }
-
-  &:active {
-    color: #999999;
-  }
-`;
-const BackIcon = () => (_jsx("svg", { width: "32", height: "32", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M12 20L4 12L12 4", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round" }) }));

package/dist/packages/core/src/stack-router/_components/header.d.ts

@@ -1,2 +0,0 @@
-declare const Header: () => import("react/jsx-runtime").JSX.Element;
-export default Header;

package/dist/packages/core/src/stack-router/_components/header.js

@@ -1,36 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useEffect } from "react";
-import styled from "@emotion/styled";
-import BackRouter from "./back-router";
-import { useStackRouter } from "../stack-router-provider";
-const Header = () => {
-    const { currentPath, visiblePages } = useStackRouter();
-    const [displayPath, setDisplayPath] = useState(currentPath);
-    const [isVisible, setIsVisible] = useState(visiblePages.length > 1);
-    useEffect(() => {
-        const timer = setTimeout(() => {
-            setDisplayPath(currentPath);
-            setIsVisible(visiblePages.length > 1);
-        }, 500);
-        return () => clearTimeout(timer);
-    }, [currentPath, visiblePages]);
-    return (_jsxs(StyledHeader, { children: [isVisible && _jsx(BackRouter, {}), _jsx(StyledTitle, { children: displayPath })] }));
-};
-/**
- styles
- */
-const StyledHeader = styled.header `
-  width: 100%;
-  height: 64px;
-  background-color: white;
-  border-bottom: 1px solid #e5e7eb;
-  display: flex;
-  align-items: center;
-  padding: 0 1rem;
-`;
-const StyledTitle = styled.h1 `
-  font-size: 1.25rem;
-  font-weight: 600;
-  color: #111827;
-`;
-export default Header;