astro-i18nya 0.1.0

package/README.md

@@ -0,0 +1,15 @@
+# astro-i18nya
+
+To install dependencies:
+
+```bash
+bun install
+```
+
+To run:
+
+```bash
+bun run index.ts
+```
+
+This project was created using `bun init` in bun v1.3.2. [Bun](https://bun.com) is a fast all-in-one JavaScript runtime.

package/babel.config.js

@@ -0,0 +1,8 @@
+module.exports = {
+  presets: [
+    ['@babel/preset-env', {targets: {node: 'current'}}],
+    '@babel/preset-typescript',
+
+    ['@babel/preset-react', {runtime: 'automatic'}],
+  ],
+};

package/jest.config.ts

@@ -0,0 +1,7 @@
+import type {Config} from 'jest';
+
+const config: Config = {
+  "testEnvironment": "jsdom"
+};
+
+export default config;

package/package.json

@@ -0,0 +1,54 @@
+{
+  "name": "astro-i18nya",
+  "version": "0.1.0",
+  "description": "Astro integration for i18nya: i18n as small as a cat's paw",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "scripts": {
+    "build": "tsc",
+    "test": "jest"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/FyraLabs/i18nya.git"
+  },
+  "keywords": [
+    "astro",
+    "internationalization",
+    "i18n",
+    "translation",
+    "localization",
+    "l10n",
+    "globalization"
+  ],
+  "author": "madonuko <mado@fyralabs.com>",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/FyraLabs/i18nya/issues"
+  },
+  "homepage": "https://github.com/FyraLabs/i18nya#readme",
+  "devDependencies": {
+    "@babel/core": "^7.28.5",
+    "@babel/preset-env": "^7.28.5",
+    "@babel/preset-react": "^7.28.5",
+    "@babel/preset-typescript": "^7.28.5",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.0",
+    "@types/jest": "^30.0.0",
+    "@types/node": "^24.10.1",
+    "babel-jest": "^30.2.0",
+    "jest": "^30.2.0",
+    "react-test-renderer": "^19.2.0",
+    "typescript": "^5.9.3"
+  },
+  "peerDependencies": {
+    "typescript": "^5"
+  },
+  "dependencies": {
+    "@astrojs/react": "^4.4.2",
+    "astro": "^5.16.0",
+    "i18nya": "^0.1.0",
+    "jest-environment-jsdom": "^30.2.0",
+    "react": "^19.2.0"
+  }
+}

package/src/Trans.test.tsx

@@ -0,0 +1,20 @@
+import { render, screen } from "@testing-library/react";
+import "@testing-library/jest-dom";
+import Trans from "./Trans";
+
+describe("<Trans />", () => {
+  it("renders nested elements according to translation string", () => {
+    const translation = "Hello <1>user</1>, welcome to <2><1>my site</1></2>.";
+    render(
+      <Trans t={translation}>
+        <b />
+        <a href="https://example.com" />
+      </Trans>,
+    );
+    expect(screen.getByText("my site")).toBeInTheDocument();
+    const bold = screen.getByText("user");
+    expect(bold.tagName).toBe("B");
+    const link = screen.getByText("my site").closest("a");
+    expect(link).toHaveAttribute("href", "https://example.com");
+  });
+});

package/src/Trans.tsx

@@ -0,0 +1,86 @@
+//? https://react.i18next.com/latest/trans-component
+// do something similar to ↑
+
+import { Children, cloneElement, isValidElement } from "react";
+import type { FunctionComponent, ReactNode } from "react";
+
+type Props = {
+  children: ReactNode;
+  t: string;
+};
+
+/**
+ * A fake version of `<Trans>` in `react-i18next` with *very different* behaviour.
+ *
+ * You feed in a list of empty elements in `<Trans>`. The structure will follow the translation strings.
+ *
+ * @example ```tsx
+ * <Trans t={t("test", { user: "John" })}>
+ *   <b />
+ *   <a href="https://example.com" />
+ * </Trans>
+ * ```
+ * With `"test": "Hello <1>{{user}}</1>, welcome to <2><1>my site</1></2>."`, the above element will become:
+ * ```tsx
+ * <b>Hello John</b>, welcome to <a href="https://example.com"><b>my site</b></a>.
+ * ```
+ *
+ * @param children the list of tags.
+ * @param t return value of t()
+ * @returns ReactNode
+ */
+export default (({ children, t }: Props) => {
+  // find /<\/(\d+)>/g, where group 1 parse to int is largest
+  const maxTagId = Math.max(
+    ...t.match(/<\/(\d+)>/g).map((i) => parseInt(i.slice(2, -1))),
+  );
+  const inputs = Children.toArray(children).filter((c) => isValidElement(c));
+  if ((maxTagId ?? 0) > inputs.length) {
+    return t; // syntax error
+  }
+
+  const elms: ReactNode[] = []; // resulting list of elements
+  const tagStack = [];
+  for (let ch_idx = 0; ch_idx < t.length; ) {
+    if (t.substring(ch_idx, ch_idx + 2) == "\\<") {
+      elms.push("<");
+      ch_idx += 2;
+      continue;
+    }
+    if (t.substring(ch_idx, ch_idx + 2) == "</") {
+      let j = 0;
+      while (t[++j + ch_idx] != ">" && j + ch_idx < t.length);
+      const tag = Number.parseInt(t.substring(++ch_idx + 1, (ch_idx += j)));
+      if (Number.isNaN(tag)) {
+        elms.push(t.substring(ch_idx - j - 1, ch_idx));
+        continue;
+      }
+      let { p, l } = tagStack.pop();
+      if (tag != p) {
+        return t; // syntax error
+      }
+      elms.push(
+        cloneElement(inputs[p - 1], {}, ...elms.splice(l, elms.length - l)),
+      );
+      continue;
+    }
+    if (t[ch_idx] == "<") {
+      let j = 0;
+      while (t[++j + ch_idx] != ">" && j + ch_idx < t.length);
+      const tag = Number.parseInt(t.substring(++ch_idx, (ch_idx += j)));
+      if (Number.isNaN(tag)) {
+        elms.push(t.substring(ch_idx - j - 1, ch_idx));
+        continue;
+      }
+      tagStack.push({ p: tag, l: elms.length });
+      elms.push(""); // in order to splice later, contents inside a new tag element must start fresh
+      continue;
+    }
+    if (typeof elms[elms.length - 1] === "string") {
+      elms[elms.length - 1] += t[ch_idx++];
+    } else {
+      elms.push(t[ch_idx++]);
+    }
+  }
+  return <>{elms}</>;
+}) satisfies FunctionComponent<Props>;

package/src/index.ts

@@ -0,0 +1,24 @@
+import type { I18Nya } from "i18nya";
+import type { AstroIntegration } from "astro";
+import react from "@astrojs/react";
+import Trans from "./Trans";
+import { listLang, getLangName } from "./util";
+export { Trans, listLang, getLangName };
+
+export default function (i18nya: I18Nya): AstroIntegration {
+  return {
+    name: "astro-i18nya",
+    hooks: {
+      "astro:config:setup": ({ updateConfig }) => {
+        updateConfig({
+          i18n: {
+            defaultLocale: i18nya.config.defaultLang,
+            locales: Object.keys(i18nya.translations),
+          },
+          // required for <Trans>
+          integrations: [react({ experimentalReactChildren: true })],
+        });
+      },
+    },
+  };
+}

package/src/util.ts

@@ -0,0 +1,24 @@
+import type { I18Nya } from "i18nya";
+
+/**
+ * Obtain the language name.
+ * @param lang the language locale
+ * @param displayLang in what language should the name of the language be shown. By default, use native language names.
+ * @returns language name
+ */
+export const getLangName = (lang: string, displayLang?: string) =>
+  new Intl.DisplayNames([displayLang ?? lang], { type: "language" }).of(lang);
+
+/**
+ * List out available languages.
+ * @param i18nya return value of `init()` from `i18nya`
+ * @param displayLang in what language should the name of the language be shown. By default, use native language names.
+ * @returns a map of language locale → language name
+ */
+export const listLang = (i18nya: I18Nya, displayLang?: string) =>
+  new Map(
+    Object.keys(i18nya.translations).map((l) => [
+      l,
+      getLangName(l.replace("_", "-"), displayLang),
+    ]),
+  );

package/tsconfig.json

@@ -0,0 +1,45 @@
+{
+  "exclude": ["./dist"],
+  "compilerOptions": {
+    "rootDir": "./src",
+    "outDir": "./dist",
+
+    // Environment setup & latest features
+    "lib": ["ESNext"],
+    "target": "ESNext",
+    "module": "Preserve",
+    "moduleDetection": "force",
+    "jsx": "react-jsx",
+    "types": ["node"],
+    "allowJs": true,
+
+    // Output settings
+    "sourceMap": true,
+    "declaration": true,
+    "declarationMap": true,
+
+    // Module resolution
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "noEmit": true,
+    "verbatimModuleSyntax": false,
+    "isolatedModules": true,
+    "resolveJsonModule": true,
+    "esModuleInterop": true,
+
+    // Best practices
+    "strict": true,
+    "skipLibCheck": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedIndexedAccess": true,
+    "strictNullChecks": false,
+    // "exactOptionalPropertyTypes": true,
+    "noImplicitOverride": true,
+    "noUncheckedSideEffectImports": true,
+
+    // Some stricter flags (disabled by default)
+    "noUnusedLocals": false,
+    "noUnusedParameters": false,
+    "noPropertyAccessFromIndexSignature": false
+  }
+}