Merge remote-tracking branch 'origin/main' into vk/6a7c-loader-data-inva

Author: orionmiz

docs/components/ChangelogContent.mdx

@@ -1,3 +1,12 @@
+## 2026.01.29
+
+Add encode option to Route interface for converting activity params to URL string params [`45fb7ba`](https://github.com/daangn/stackflow/commit/45fb7ba271b8aaf754d25c2a241e54bd15bdd2dc)
+
+Released packages:
+- 📦 [@stackflow/plugin-history-sync@1.10.0](https://npmjs.com/package/@stackflow/plugin-history-sync/v/1.10.0)
+
+---
+
 ## 2026.01.07
 
 Add an option to skip default history setup transition [`a7d0c01`](https://github.com/daangn/stackflow/commit/a7d0c01c171001e6d99432a1df2242ef8faca011)

docs/pages/api-references/plugins/plugin-basic-ui.ko.mdx

@@ -29,8 +29,8 @@ const { Stack, useFlow } = stackflow({
 ```
 ### `basicUIPlugin` 옵션
 <APITable>
-| ---- | ---- | ---- |
 |      |      |      | 
+| ---- | ---- | ---- |
 | theme | `cupertino` \| `android` | 테마를 설정해요. |
 | rootClassName | `string`(optional) | 루트 클래스 이름을 설정해요. |
 | appBar | `AppBar`(optional) | 앱 바를 설정해요. |
@@ -49,8 +49,8 @@ const Something = () => {
 ```
 ### `appBar`
 <APITable>
-| ---- | ---- | ---- |
 |      |      |      | 
+| ---- | ---- | ---- |
 | backButton | `{ renderIcon?: () => ReactNode; ariaLabel?: string }` \| `{ render?: () => ReactNode }` | 뒤로가기 버튼을 설정해요. |
 | closeButton | `{ renderIcon?: () => ReactNode; ariaLabel?; string, onClick: (e) => void; }` \| `{ render?: () => ReactNode }` | 닫기 버튼을 설정해요. |
 </APITable>

extensions/plugin-history-sync/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @stackflow/plugin-history-sync
 
+## 1.10.0
+
+### Minor Changes
+
+- 45fb7ba: Add encode option to Route interface for converting activity params to URL string params
+
 ## 1.9.0
 
 ### Minor Changes

extensions/plugin-history-sync/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stackflow/plugin-history-sync",
-  "version": "1.9.0",
+  "version": "1.10.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/daangn/stackflow.git",

extensions/plugin-history-sync/src/RouteLike.ts

@@ -9,6 +9,11 @@ export type Route<ComponentType> = {
   decode?: (
     params: Record<string, string>,
   ) => ComponentType extends ActivityComponentType<infer U> ? U : {};
+  encode?: (
+    params: ComponentType extends ActivityComponentType<infer U>
+      ? U
+      : Record<string, any>,
+  ) => Record<string, string | undefined>;
   defaultHistory?: (
     params: Record<string, string>,
   ) => HistoryEntry[] | DefaultHistoryDescriptor;

extensions/plugin-history-sync/src/makeTemplate.spec.ts

@@ -76,3 +76,20 @@ test("makeTemplate - parse with given decode function", () => {
     articleId: 1234,
   });
 });
+
+test("makeTemplate - fill with encode function using JSON.stringify for object params", () => {
+  const template = makeTemplate({
+    path: "/search",
+    encode: (params) => ({
+      filter: JSON.stringify(params.filter),
+    }),
+  });
+
+  expect(
+    template.fill({
+      filter: { category: "tech", tags: ["javascript", "react"] },
+    }),
+  ).toEqual(
+    "/search/?filter=%7B%22category%22%3A%22tech%22%2C%22tags%22%3A%5B%22javascript%22%2C%22react%22%5D%7D",
+  );
+});

extensions/plugin-history-sync/src/makeTemplate.ts

@@ -46,7 +46,7 @@ export interface UrlPatternOptions {
 }
 
 export function makeTemplate<T>(
-  { path, decode }: Route<T>,
+  { path, decode, encode }: Route<T>,
   urlPatternOptions?: UrlPatternOptions,
 ) {
   const pattern = new UrlPattern(`${path}(/)`, urlPatternOptions);
@@ -58,11 +58,14 @@ export function makeTemplate<T>(
     : (pattern as any).names.length;
 
   return {
-    fill(params: { [key: string]: string | undefined }) {
-      const pathname = pattern.stringify(params);
+    fill(params: { [key: string]: any }) {
+      const encodedParams: { [key: string]: string | undefined } = encode
+        ? encode(params as Parameters<typeof encode>[0])
+        : params;
+      const pathname = pattern.stringify(encodedParams);
       const pathParams = pattern.match(pathname);
 
-      const searchParamsMap = { ...params };
+      const searchParamsMap = { ...encodedParams };
 
       Object.keys(pathParams).forEach((key) => {
         delete searchParamsMap[key];