@nimpl/getters 1.3.0

package/LICENSE

@@ -0,0 +1,7 @@
+The MIT License (MIT)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/README.md

@@ -0,0 +1,41 @@
+# @nimpl/getters
+
+Implementation of server getters and server contexts in React Server Components without switching to SSR
+
+Before using the library, read the [Possible Issues](https://nimpl.tech/getters/possible-issues)
+
+## Installation
+
+**Using npm:**
+```bash
+npm i @nimpl/getters
+```
+
+**Using yarn:**
+```bash
+yarn add @nimpl/getters
+```
+
+## Current Getters
+
+* [get-pathname](https://nimpl.tech/getters/current-getters/get-pathname)
+* [server-contexts](https://nimpl.tech/getters/current-getters/server-contexts)
+* [get-page-config](https://nimpl.tech/getters/current-getters/get-page-config)
+* [get-params](https://nimpl.tech/getters/current-getters/get-params)
+* [get-search-params](https://nimpl.tech/getters/current-getters/get-search-params)
+
+## Stability
+
+All getters are covered with tests. Tests are run on every release and every 6 hours on the latest **Canary** version of `Next.js`.
+
+In this way, you can be sure not only of the stability of the code, but also that if there is a breaking change in `Next.js`, this will immediately become known. *Even before the release of a stable version of `Next.js`.*
+
+## Examples
+
+You can see examples in the [directory](https://github.com/vordgi/nimpl-getters/tree/main/examples) of the repository.
+
+## Additional
+
+Please consider giving a star if you like it, it will help promote the implementation in the eyes of the next.js team.
+
+Create tasks for identified issues, desired getters, or various improvements.

package/create-server-context.d.ts

@@ -0,0 +1,3 @@
+import type { ServerContext } from './types';
+declare function createServerContext<T>(defaultValue?: T): ServerContext<T>;
+export default createServerContext;

package/create-server-context.js

@@ -0,0 +1,30 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const async_hooks_1 = require("async_hooks");
+const server_getter_in_client_component_error_1 = require("./server-getter-in-client-component-error");
+const react_1 = __importDefault(require("react"));
+const Enter = ({ storage, value }) => {
+    storage.enterWith({ value });
+    return react_1.default.createElement(react_1.default.Fragment, null);
+};
+function createServerContext(defaultValue) {
+    (0, server_getter_in_client_component_error_1.serverGetterInClientComponentError)('createServerContext');
+    const storage = new async_hooks_1.AsyncLocalStorage();
+    return {
+        Provider: async ({ children, value }) => {
+            return (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement(Enter, { storage: storage, value: value }),
+                children));
+        },
+        Consumer: ({ children }) => {
+            const store = storage.getStore();
+            return children(store ? store.value : defaultValue);
+        },
+        _storage: storage,
+        _defaultValue: defaultValue,
+    };
+}
+exports.default = createServerContext;

package/get-page-config.d.ts

@@ -0,0 +1,11 @@
+export declare const getPageConfig: () => {
+    pagePath?: undefined;
+    dynamic?: undefined;
+    revalidate?: undefined;
+    basePath?: undefined;
+} | {
+    pagePath: string | undefined;
+    dynamic: string;
+    revalidate: import("next/dist/server/lib/revalidate").Revalidate | undefined;
+    basePath: string;
+};

package/get-page-config.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getPageConfig = void 0;
+const static_generation_async_storage_external_1 = require("next/dist/client/components/static-generation-async-storage.external");
+const server_getter_in_client_component_error_1 = require("./server-getter-in-client-component-error");
+const getPageConfig = () => {
+    (0, server_getter_in_client_component_error_1.serverGetterInClientComponentError)('getPageConfig');
+    const store = static_generation_async_storage_external_1.staticGenerationAsyncStorage.getStore();
+    if (!store)
+        return {};
+    const basePath = process.env.__NEXT_ROUTER_BASEPATH || '';
+    const { pagePath, forceDynamic, forceStatic, dynamicShouldError, revalidate } = store || {};
+    let dynamic = 'auto';
+    if (forceDynamic) {
+        dynamic = 'force-dynamic';
+    }
+    else if (forceStatic) {
+        dynamic = 'force-static';
+    }
+    else if (dynamicShouldError) {
+        dynamic = 'error';
+    }
+    return { pagePath, dynamic, revalidate, basePath };
+};
+exports.getPageConfig = getPageConfig;

package/get-params.d.ts

@@ -0,0 +1,3 @@
+export declare const getParams: () => {
+    [key: string]: string | string[];
+};

package/get-params.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getParams = void 0;
+const static_generation_async_storage_external_1 = require("next/dist/client/components/static-generation-async-storage.external");
+const utils_1 = require("./utils");
+const server_getter_in_client_component_error_1 = require("./server-getter-in-client-component-error");
+const getParams = () => {
+    (0, server_getter_in_client_component_error_1.serverGetterInClientComponentError)('getParams');
+    const store = static_generation_async_storage_external_1.staticGenerationAsyncStorage.getStore();
+    if (!store)
+        return {};
+    const { urlPathname, pagePath = '/' } = store;
+    const cleanUrlPathname = (0, utils_1.normalizePathname)(urlPathname);
+    const cleanPagePath = (0, utils_1.normalizePagePath)(pagePath);
+    const pagePathParts = cleanPagePath.split('/').slice(1).filter(part => !part.match(/^(\([^)]+\)|\@.+)$/));
+    const pagePathInterceptedParts = (0, utils_1.normalizeInterceptingRoutes)(pagePathParts);
+    const pathnameParts = cleanUrlPathname.split('/').slice(1);
+    const isRootPage = cleanUrlPathname === '' && cleanPagePath === '';
+    const isNotFoundPage = pagePath.match(/\/_not-found\/?$/);
+    const isValidCatchALl = cleanPagePath.match(/\/\[\.\.\.[^\]]+\]/) && pathnameParts.length >= pagePathInterceptedParts.length;
+    const isValidOptionalCatchALl = cleanPagePath.match(/\/\[\[\.\.\.[^\]]+\]\]/) && pathnameParts.length >= pagePathInterceptedParts.length - 1;
+    const isCorrectMatched = isRootPage || isNotFoundPage || pagePathInterceptedParts.length === pathnameParts.length || isValidCatchALl || isValidOptionalCatchALl;
+    if (!isCorrectMatched) {
+        const createIssueUrl = new URL('https://github.com/vordgi/nimpl-getters/issues/new');
+        createIssueUrl.searchParams.set('title', 'Error parsing segments in get-params');
+        createIssueUrl.searchParams.set('body', `urlPathname: \`${urlPathname}\`;\n\npagePath: \`${pagePath}\`;`);
+        createIssueUrl.searchParams.append('labels', 'bug');
+        throw new Error(`Something went wrong. Please create an issue on Github: ${createIssueUrl}`);
+    }
+    const query = (0, utils_1.parseSegments)(pagePathInterceptedParts, pathnameParts);
+    return query;
+};
+exports.getParams = getParams;

package/get-pathname.d.ts

@@ -0,0 +1 @@
+export declare function getPathname(): string | null;

package/get-pathname.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getPathname = void 0;
+const static_generation_async_storage_external_1 = require("next/dist/client/components/static-generation-async-storage.external");
+const has_base_path_1 = require("next/dist/client/has-base-path");
+const remove_base_path_1 = require("next/dist/client/remove-base-path");
+const server_getter_in_client_component_error_1 = require("./server-getter-in-client-component-error");
+function getPathname() {
+    (0, server_getter_in_client_component_error_1.serverGetterInClientComponentError)('getPathname');
+    const store = static_generation_async_storage_external_1.staticGenerationAsyncStorage.getStore();
+    if (!store)
+        return null;
+    const { urlPathname } = store;
+    const url = new URL(urlPathname, 'http://n');
+    const pathname = (0, has_base_path_1.hasBasePath)(url.pathname)
+        ? (0, remove_base_path_1.removeBasePath)(url.pathname)
+        : url.pathname;
+    return pathname;
+}
+exports.getPathname = getPathname;

package/get-search-params.d.ts

@@ -0,0 +1,5 @@
+import { ReadonlyURLSearchParams } from 'next/navigation';
+/** @deprecated getSearchParams is deprecated. [Read more](https://nimpl.tech/getters/current-getters/get-search-params) */
+export declare function getSearchParams(opts?: {
+    ignoreDynamicOptionErrors?: boolean;
+}): URLSearchParams | ReadonlyURLSearchParams;

package/get-search-params.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getSearchParams = void 0;
+const static_generation_async_storage_external_1 = require("next/dist/client/components/static-generation-async-storage.external");
+const server_getter_in_client_component_error_1 = require("./server-getter-in-client-component-error");
+const navigation_1 = require("next/navigation");
+const internal_utils_1 = require("next/dist/server/internal-utils");
+/** @deprecated getSearchParams is deprecated. [Read more](https://nimpl.tech/getters/current-getters/get-search-params) */
+function getSearchParams(opts) {
+    (0, server_getter_in_client_component_error_1.serverGetterInClientComponentError)('getSearchParams');
+    console.error('getSearchParams is deprecated. Read more - https://nimpl.tech/getters/current-getters/get-search-params');
+    const store = static_generation_async_storage_external_1.staticGenerationAsyncStorage.getStore();
+    if (!store)
+        return new URLSearchParams();
+    const { urlPathname, forceStatic, forceDynamic, dynamicShouldError } = store;
+    if (!opts?.ignoreDynamicOptionErrors) {
+        if (forceStatic) {
+            throw new Error('Сannot get client search parameters with dynamic=force-static setting');
+        }
+        else if (dynamicShouldError) {
+            throw new Error('Сannot get client search parameters with dynamic=error setting');
+        }
+        else if (!forceDynamic) {
+            console.warn('Do not use getSearchParams with unselected dynamic setting, use force-dynamic instead');
+        }
+    }
+    const url = new URL(urlPathname, 'http://n');
+    const strippedUrl = (0, internal_utils_1.stripInternalSearchParams)(url, true);
+    const readonlySearchParams = new navigation_1.ReadonlyURLSearchParams(strippedUrl.searchParams);
+    return readonlySearchParams;
+}
+exports.getSearchParams = getSearchParams;

package/get-server-context.d.ts

@@ -0,0 +1,3 @@
+import type { ServerContext } from './types';
+declare function getServerContext<T>({ _storage, _defaultValue }: ServerContext<T>): T | undefined;
+export default getServerContext;

package/get-server-context.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const server_getter_in_client_component_error_1 = require("./server-getter-in-client-component-error");
+function getServerContext({ _storage, _defaultValue }) {
+    (0, server_getter_in_client_component_error_1.serverGetterInClientComponentError)('getServerContext');
+    const store = _storage.getStore();
+    if (!store)
+        return _defaultValue;
+    return store.value;
+}
+exports.default = getServerContext;

package/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "@nimpl/getters",
+  "version": "1.3.0",
+  "description": "Implementation of server getters and server contexts in React Server Components without switching to SSR",
+  "files": [
+    "**/*.js",
+    "**/*.d.ts"
+  ],
+  "scripts": {
+    "build": "tsc"
+  },
+  "keywords": [
+    "next",
+    "next.js",
+    "server components",
+    "react.js",
+    "get-pathname",
+    "getters",
+    "implementation",
+    "get-params",
+    "rsc",
+    "server context"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/vordgi/nimpl-getters.git"
+  },
+  "author": {
+    "name": "Savelyev Alexander",
+    "email": "vordgi1@gmail.com",
+    "url": "https://github.com/vordgi/"
+  },
+  "license": "MIT",
+  "devDependencies": {
+    "@types/node": "20.0.0",
+    "@types/react": "18.2.43",
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
+    "next": "14.0.4",
+    "typescript": "5.3.2"
+  },
+  "peerDependencies": {
+    "react": ">= 18.2.0",
+    "react-dom": ">= 18.2.0",
+    "next": ">= 14.0.0"
+  }
+}

package/server-getter-in-client-component-error.d.ts

@@ -0,0 +1 @@
+export declare function serverGetterInClientComponentError(getterName: string): void | never;

package/server-getter-in-client-component-error.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.serverGetterInClientComponentError = void 0;
+const react_1 = __importDefault(require("react"));
+function serverGetterInClientComponentError(getterName) {
+    if (process.env.NODE_ENV !== 'production') {
+        // If useState is defined we're in a client component
+        if (Boolean(react_1.default.useState)) {
+            throw new Error(`${getterName} only works in Server Components`);
+        }
+    }
+}
+exports.serverGetterInClientComponentError = serverGetterInClientComponentError;

package/types.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+/// <reference types="node" />
+import type { AsyncLocalStorage } from "async_hooks";
+export type ServerContext<T> = {
+    Provider: ({ children, value }: {
+        children: React.ReactNode;
+        value: T;
+    }) => React.ReactNode;
+    Consumer: ({ children }: {
+        children: (context: T | undefined) => React.ReactNode;
+    }) => React.ReactNode;
+    _storage: AsyncLocalStorage<{
+        value: T;
+    }>;
+    _defaultValue: T | undefined;
+};

package/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/utils.d.ts

@@ -0,0 +1,6 @@
+export declare const normalizePathname: (pathname: string) => string;
+export declare const normalizePagePath: (pagePath: string) => string;
+export declare const parseSegments: (pagePathParts: string[], pathnameParts: string[]) => {
+    [key: string]: string | string[];
+};
+export declare const normalizeInterceptingRoutes: (pageParts: string[]) => string[];

package/utils.js

@@ -0,0 +1,71 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.normalizeInterceptingRoutes = exports.parseSegments = exports.normalizePagePath = exports.normalizePathname = void 0;
+const normalizePathname = (pathname) => {
+    const cleanPathname = pathname && new URL(pathname, 'http://n').pathname;
+    const pathnameWithoutTrailingSlash = cleanPathname?.replace(/^(\/.*)\/$/, '$1');
+    const pathnameWithoutFileType = pathnameWithoutTrailingSlash?.replace(/\/_not-found$/, '');
+    return pathnameWithoutFileType || '/';
+};
+exports.normalizePathname = normalizePathname;
+const normalizePagePath = (pagePath) => {
+    const cleanPagePath = pagePath && new URL(pagePath, 'http://n').pathname;
+    const pagePathWithoutFileType = cleanPagePath?.replace(/(\/page|\/_not-found)$/, '');
+    return pagePathWithoutFileType || '/';
+};
+exports.normalizePagePath = normalizePagePath;
+const parseSegments = (pagePathParts, pathnameParts) => {
+    const query = pagePathParts.reduce((acc, cur, index) => {
+        const optionalCatchAllSegment = cur.match(/^\[\[\.\.\.([^\]]+)\]\]$/);
+        if (optionalCatchAllSegment) {
+            const key = optionalCatchAllSegment[1];
+            const segmentParts = pathnameParts.slice(index);
+            if (segmentParts.length) {
+                acc[key] = segmentParts;
+            }
+            return acc;
+        }
+        const catchAllSegment = cur.match(/^\[\.\.\.([^\]]+)\]$/);
+        if (catchAllSegment) {
+            const key = catchAllSegment[1];
+            acc[key] = pathnameParts.slice(index);
+            return acc;
+        }
+        const dynamicSegment = cur.match(/^\[([^\]]+)\]$/);
+        if (dynamicSegment) {
+            const key = dynamicSegment[1];
+            acc[key] = pathnameParts[index];
+            return acc;
+        }
+        return acc;
+    }, {});
+    return query;
+};
+exports.parseSegments = parseSegments;
+const normalizeInterceptingRoutes = (pageParts) => {
+    let skip = 0;
+    const normilizedParts = [];
+    for (const pagepart of [...pageParts].reverse()) {
+        if (skip) {
+            skip -= 1;
+            continue;
+        }
+        if (pagepart.startsWith('(...)')) {
+            normilizedParts.push(pagepart.replace(/^\(\.\.\.\)/, ''));
+            break;
+        }
+        else if (pagepart.startsWith('(.)')) {
+            normilizedParts.push(pagepart.replace(/^\(\.\)/, ''));
+        }
+        else if (pagepart.startsWith('(..)')) {
+            const skipLeafs = pagepart.match(/\(\.\.\)/g);
+            skip += skipLeafs?.length || 0;
+            normilizedParts.push(pagepart.replace(/^(\(\.\.\))+/, ''));
+        }
+        else {
+            normilizedParts.push(pagepart);
+        }
+    }
+    return normilizedParts.reverse();
+};
+exports.normalizeInterceptingRoutes = normalizeInterceptingRoutes;