mudah-kit

Framework-agnostic utilities (pure TypeScript) that work in:

• Browser environment
• SSR environment (e.g. Next.js getServerSideProps / getInitialProps)

No React import. No Node http import. SSR works by receiving req/res context from the host app.

Install

pnpm add mudah-kit

API

generateMudahClientId(options?)

• If cookie exists → return existing value
• If not → generate a new UUID
  • Browser → set via document.cookie
  • SSR → set via res.setHeader('Set-Cookie', ...)
  • If SSR has no res → only return value, do not set cookie

import { generateMudahClientId } from 'mudah-kit';

const id = generateMudahClientId({
  cookieDomain: '.example.com',
  expiryDays: 90,
});

Subpath imports (import theo file / feature)

Bạn có thể import theo feature để tránh “kéo” cả package:

import { generateMudahClientId } from 'mudah-kit/mudahClientId';

Hoặc import đúng file cần dùng:

import { generateMudahClientId } from 'mudah-kit/mudahClientId/generateMudahClientId';
import { MUDAH_CLIENT_ID_COOKIE } from 'mudah-kit/mudahClientId/constants';

Usage examples

Browser usage

import { generateMudahClientId } from 'mudah-kit';

const clientId = generateMudahClientId();
console.log(clientId);

Next.js SSR usage (getServerSideProps)

import type { GetServerSideProps } from 'next';
import { generateMudahClientId } from 'mudah-kit/mudahClientId';

export const getServerSideProps: GetServerSideProps = async (ctx) => {
  const clientId = generateMudahClientId({
    context: {
      req: { headers: { cookie: ctx.req.headers.cookie } },
      res: {
        getHeader: (name) => ctx.res.getHeader(name),
        setHeader: (name, value) => ctx.res.setHeader(name, value),
      },
    },
  });

  return {
    props: { clientId },
  };
};

Build output

This package builds to:

• dist/index.js (CommonJS)
• dist/index.mjs (ESM)
• dist/index.d.ts (Type definitions)

And subpath builds for feature modules, for example:

• dist/mudahClientId/index.js|.mjs|.d.ts
• dist/mudahClientId/generateMudahClientId.js|.mjs|.d.ts