@fluxonjs/router 0.1.0

package/dist/components.d.ts

@@ -0,0 +1,15 @@
+type RouteConfig = {
+    path: string;
+    element: any;
+};
+export declare function Router(props: {
+    routes: RouteConfig[];
+    fallback?: any;
+}): DocumentFragment;
+export declare function Link(props: {
+    to: string;
+    children?: any;
+    class?: string;
+}): import("@fluxonjs/core").JSX.Element;
+export {};
+//# sourceMappingURL=components.d.ts.map

package/dist/components.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../src/components.tsx"],"names":[],"mappings":"AAIA,KAAK,WAAW,GAAG;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,GAAG,CAAC;CACd,CAAC;AAEF,wBAAgB,MAAM,CAAC,KAAK,EAAE;IAAE,MAAM,EAAE,WAAW,EAAE,CAAC;IAAC,QAAQ,CAAC,EAAE,GAAG,CAAA;CAAE,oBA6CtE;AAED,wBAAgB,IAAI,CAAC,KAAK,EAAE;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,GAAG,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,wCAazE"}

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export { location, params, navigate } from "./router";
+export { Router, Link } from "./components";
+export type { Location } from "./router";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AACtD,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAC5C,YAAY,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC"}

package/dist/index.js

@@ -0,0 +1,109 @@
+// src/router.ts
+import { signal } from "@fluxonjs/core";
+var [location, setLocation] = signal({
+  pathname: window.location.pathname,
+  search: window.location.search,
+  hash: window.location.hash
+});
+window.addEventListener("popstate", () => {
+  setLocation({
+    pathname: window.location.pathname,
+    search: window.location.search,
+    hash: window.location.hash
+  });
+});
+function navigate(to, options = {}) {
+  if (options.replace) {
+    window.history.replaceState(null, "", to);
+  } else {
+    window.history.pushState(null, "", to);
+  }
+  setLocation({
+    pathname: window.location.pathname,
+    search: window.location.search,
+    hash: window.location.hash
+  });
+}
+var [params, setParams] = signal({});
+
+// src/components.tsx
+import { effect } from "@fluxonjs/core";
+
+// src/match.ts
+function matchPath(pattern, path) {
+  const patternParts = pattern.split("/").filter(Boolean);
+  const pathParts = path.split("/").filter(Boolean);
+  if (patternParts.length !== pathParts.length) return null;
+  const params2 = {};
+  for (let i = 0; i < patternParts.length; i++) {
+    const p = patternParts[i];
+    const u = pathParts[i];
+    if (p.startsWith(":")) {
+      params2[p.slice(1)] = decodeURIComponent(u);
+    } else if (p !== u) {
+      return null;
+    }
+  }
+  return params2;
+}
+
+// src/components.tsx
+import { jsx } from "@fluxonjs/core/jsx-runtime";
+function Router(props) {
+  const fragment = document.createDocumentFragment();
+  const startMarker = document.createComment("router-start");
+  const endMarker = document.createComment("router-end");
+  fragment.appendChild(startMarker);
+  fragment.appendChild(endMarker);
+  let currentNode = null;
+  effect(() => {
+    const currentPath = location().pathname;
+    const parent = startMarker.parentNode;
+    if (!parent) return;
+    if (currentNode && currentNode.parentNode) {
+      currentNode.parentNode.removeChild(currentNode);
+      currentNode = null;
+    }
+    let element = props.fallback ?? null;
+    for (const route of props.routes) {
+      const matchedParams = matchPath(route.path, currentPath);
+      if (matchedParams) {
+        setParams(matchedParams);
+        element = route.element;
+        break;
+      }
+    }
+    if (!element) {
+      setParams({});
+      return;
+    }
+    const node = typeof element === "function" ? element() : element;
+    if (node instanceof Node) {
+      currentNode = node;
+      parent.insertBefore(node, endMarker);
+    }
+  });
+  return fragment;
+}
+function Link(props) {
+  return /* @__PURE__ */ jsx(
+    "a",
+    {
+      href: props.to,
+      class: props.class,
+      onClick: (e) => {
+        e.preventDefault();
+        navigate(props.to);
+      },
+      children: props.children
+    }
+  );
+}
+export {
+  Link,
+  Router,
+  location,
+  navigate,
+  params
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/router.ts","../src/components.tsx","../src/match.ts"],"sourcesContent":["import { signal } from \"@fluxonjs/core\";\r\n\r\nexport type Location = {\r\n  pathname: string;\r\n  search: string;\r\n  hash: string;\r\n};\r\n\r\ntype NavigateOptions = {\r\n  replace?: boolean;\r\n};\r\n\r\nconst [location, setLocation] = signal<Location>({\r\n  pathname: window.location.pathname,\r\n  search: window.location.search,\r\n  hash: window.location.hash,\r\n});\r\n\r\nwindow.addEventListener(\"popstate\", () => {\r\n  setLocation({\r\n    pathname: window.location.pathname,\r\n    search: window.location.search,\r\n    hash: window.location.hash,\r\n  });\r\n});\r\n\r\nexport function navigate(to: string, options: NavigateOptions = {}) {\r\n  if (options.replace) {\r\n    window.history.replaceState(null, \"\", to);\r\n  } else {\r\n    window.history.pushState(null, \"\", to);\r\n  }\r\n\r\n  setLocation({\r\n    pathname: window.location.pathname,\r\n    search: window.location.search,\r\n    hash: window.location.hash,\r\n  });\r\n}\r\n\r\nconst [params, setParams] = signal<Record<string, string>>({});\r\n\r\nexport { location, params, setParams };","import { effect } from \"@fluxonjs/core\";\r\nimport { location, setParams, navigate } from \"./router\";\r\nimport { matchPath } from \"./match\";\r\n\r\ntype RouteConfig = {\r\n  path: string;\r\n  element: any;\r\n};\r\n\r\nexport function Router(props: { routes: RouteConfig[]; fallback?: any }) {\r\n  const fragment = document.createDocumentFragment();\r\n  const startMarker = document.createComment(\"router-start\");\r\n  const endMarker = document.createComment(\"router-end\");\r\n\r\n  fragment.appendChild(startMarker);\r\n  fragment.appendChild(endMarker);\r\n\r\n  let currentNode: Node | null = null;\r\n\r\n  effect(() => {\r\n    const currentPath = location().pathname;\r\n    const parent = startMarker.parentNode;\r\n    if (!parent) return;\r\n\r\n    if (currentNode && currentNode.parentNode) {\r\n      currentNode.parentNode.removeChild(currentNode);\r\n      currentNode = null;\r\n    }\r\n\r\n    let element: any = props.fallback ?? null;\r\n\r\n    for (const route of props.routes) {\r\n      const matchedParams = matchPath(route.path, currentPath);\r\n      if (matchedParams) {\r\n        setParams(matchedParams);\r\n        element = route.element;\r\n        break;\r\n      }\r\n    }\r\n\r\n    if (!element) {\r\n      setParams({});\r\n      return;\r\n    }\r\n\r\n    const node = typeof element === \"function\" ? element() : element;\r\n\r\n    if (node instanceof Node) {\r\n      currentNode = node;\r\n      parent.insertBefore(node, endMarker);\r\n    }\r\n  });\r\n\r\n  return fragment;\r\n}\r\n\r\nexport function Link(props: { to: string; children?: any; class?: string }) {\r\n  return (\r\n    <a\r\n      href={props.to}\r\n      class={props.class}\r\n      onClick={(e: MouseEvent) => {\r\n        e.preventDefault();\r\n        navigate(props.to);\r\n      }}\r\n    >\r\n      {props.children}\r\n    </a>\r\n  );\r\n}","export function matchPath(pattern: string, path: string): Record<string, string> | null {\r\n  const patternParts = pattern.split(\"/\").filter(Boolean);\r\n  const pathParts = path.split(\"/\").filter(Boolean);\r\n\r\n  if (patternParts.length !== pathParts.length) return null;\r\n\r\n  const params: Record<string, string> = {};\r\n\r\n  for (let i = 0; i < patternParts.length; i++) {\r\n    const p = patternParts[i];\r\n    const u = pathParts[i];\r\n\r\n    if (p.startsWith(\":\")) {\r\n      params[p.slice(1)] = decodeURIComponent(u);\r\n    } else if (p !== u) {\r\n      return null;\r\n    }\r\n  }\r\n\r\n  return params;\r\n}"],"mappings":";AAAA,SAAS,cAAc;AAYvB,IAAM,CAAC,UAAU,WAAW,IAAI,OAAiB;AAAA,EAC/C,UAAU,OAAO,SAAS;AAAA,EAC1B,QAAQ,OAAO,SAAS;AAAA,EACxB,MAAM,OAAO,SAAS;AACxB,CAAC;AAED,OAAO,iBAAiB,YAAY,MAAM;AACxC,cAAY;AAAA,IACV,UAAU,OAAO,SAAS;AAAA,IAC1B,QAAQ,OAAO,SAAS;AAAA,IACxB,MAAM,OAAO,SAAS;AAAA,EACxB,CAAC;AACH,CAAC;AAEM,SAAS,SAAS,IAAY,UAA2B,CAAC,GAAG;AAClE,MAAI,QAAQ,SAAS;AACnB,WAAO,QAAQ,aAAa,MAAM,IAAI,EAAE;AAAA,EAC1C,OAAO;AACL,WAAO,QAAQ,UAAU,MAAM,IAAI,EAAE;AAAA,EACvC;AAEA,cAAY;AAAA,IACV,UAAU,OAAO,SAAS;AAAA,IAC1B,QAAQ,OAAO,SAAS;AAAA,IACxB,MAAM,OAAO,SAAS;AAAA,EACxB,CAAC;AACH;AAEA,IAAM,CAAC,QAAQ,SAAS,IAAI,OAA+B,CAAC,CAAC;;;ACxC7D,SAAS,cAAc;;;ACAhB,SAAS,UAAU,SAAiB,MAA6C;AACtF,QAAM,eAAe,QAAQ,MAAM,GAAG,EAAE,OAAO,OAAO;AACtD,QAAM,YAAY,KAAK,MAAM,GAAG,EAAE,OAAO,OAAO;AAEhD,MAAI,aAAa,WAAW,UAAU,OAAQ,QAAO;AAErD,QAAMA,UAAiC,CAAC;AAExC,WAAS,IAAI,GAAG,IAAI,aAAa,QAAQ,KAAK;AAC5C,UAAM,IAAI,aAAa,CAAC;AACxB,UAAM,IAAI,UAAU,CAAC;AAErB,QAAI,EAAE,WAAW,GAAG,GAAG;AACrB,MAAAA,QAAO,EAAE,MAAM,CAAC,CAAC,IAAI,mBAAmB,CAAC;AAAA,IAC3C,WAAW,MAAM,GAAG;AAClB,aAAO;AAAA,IACT;AAAA,EACF;AAEA,SAAOA;AACT;;;ADsCI;AAjDG,SAAS,OAAO,OAAkD;AACvE,QAAM,WAAW,SAAS,uBAAuB;AACjD,QAAM,cAAc,SAAS,cAAc,cAAc;AACzD,QAAM,YAAY,SAAS,cAAc,YAAY;AAErD,WAAS,YAAY,WAAW;AAChC,WAAS,YAAY,SAAS;AAE9B,MAAI,cAA2B;AAE/B,SAAO,MAAM;AACX,UAAM,cAAc,SAAS,EAAE;AAC/B,UAAM,SAAS,YAAY;AAC3B,QAAI,CAAC,OAAQ;AAEb,QAAI,eAAe,YAAY,YAAY;AACzC,kBAAY,WAAW,YAAY,WAAW;AAC9C,oBAAc;AAAA,IAChB;AAEA,QAAI,UAAe,MAAM,YAAY;AAErC,eAAW,SAAS,MAAM,QAAQ;AAChC,YAAM,gBAAgB,UAAU,MAAM,MAAM,WAAW;AACvD,UAAI,eAAe;AACjB,kBAAU,aAAa;AACvB,kBAAU,MAAM;AAChB;AAAA,MACF;AAAA,IACF;AAEA,QAAI,CAAC,SAAS;AACZ,gBAAU,CAAC,CAAC;AACZ;AAAA,IACF;AAEA,UAAM,OAAO,OAAO,YAAY,aAAa,QAAQ,IAAI;AAEzD,QAAI,gBAAgB,MAAM;AACxB,oBAAc;AACd,aAAO,aAAa,MAAM,SAAS;AAAA,IACrC;AAAA,EACF,CAAC;AAED,SAAO;AACT;AAEO,SAAS,KAAK,OAAuD;AAC1E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM,MAAM;AAAA,MACZ,OAAO,MAAM;AAAA,MACb,SAAS,CAAC,MAAkB;AAC1B,UAAE,eAAe;AACjB,iBAAS,MAAM,EAAE;AAAA,MACnB;AAAA,MAEC,gBAAM;AAAA;AAAA,EACT;AAEJ;","names":["params"]}

package/dist/match.d.ts

@@ -0,0 +1,2 @@
+export declare function matchPath(pattern: string, path: string): Record<string, string> | null;
+//# sourceMappingURL=match.d.ts.map

package/dist/match.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"match.d.ts","sourceRoot":"","sources":["../src/match.ts"],"names":[],"mappings":"AAAA,wBAAgB,SAAS,CAAC,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAoBtF"}

package/dist/router.d.ts

@@ -0,0 +1,13 @@
+export type Location = {
+    pathname: string;
+    search: string;
+    hash: string;
+};
+type NavigateOptions = {
+    replace?: boolean;
+};
+declare const location: import("@fluxonjs/core").SignalGetter<Location>;
+export declare function navigate(to: string, options?: NavigateOptions): void;
+declare const params: import("@fluxonjs/core").SignalGetter<Record<string, string>>, setParams: (newValue: Record<string, string> | ((prev: Record<string, string>) => Record<string, string>)) => void;
+export { location, params, setParams };
+//# sourceMappingURL=router.d.ts.map

package/dist/router.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"router.d.ts","sourceRoot":"","sources":["../src/router.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,QAAQ,GAAG;IACrB,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,KAAK,eAAe,GAAG;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,QAAA,MAAO,QAAQ,iDAIb,CAAC;AAUH,wBAAgB,QAAQ,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,eAAoB,QAYjE;AAED,QAAA,MAAO,MAAM,iEAAE,SAAS,yGAAsC,CAAC;AAE/D,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC"}

package/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "@fluxonjs/router",
+  "version": "0.1.0",
+  "type": "module",
+  "description": "Official router for FluxonJS",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "peerDependencies": {
+    "@fluxonjs/core": "^0.1.7"
+  },
+  "devDependencies": {
+    "@fluxonjs/core": "0.1.7",
+    "tsup": "^8.5.1",
+    "typescript": "^5.0.0"
+  },
+  "license": "MIT",
+  "scripts": {
+    "build": "tsup && tsc --emitDeclarationOnly"
+  }
+}