@huliiiiii/lingui-solid 6.0.0-next.3

package/README.md

@@ -0,0 +1,25 @@
+[![License][badge-license]][license]
+[![Version][badge-version]][package]
+[![Downloads][badge-downloads]][package]
+
+# @huliiiiii/lingui-solid
+
+> SolidJS components for internationalization
+
+`@huliiiiii/lingui-solid` is part of [LinguiJS][linguijs]. See the [documentation][documentation] for all information, tutorials and examples.
+
+## Installation & Usage
+
+See the [documentation][documentation].
+
+## License
+
+[MIT][license]
+
+[license]: https://github.com/lingui/js-lingui/blob/main/LICENSE
+[linguijs]: https://github.com/lingui/js-lingui
+[documentation]: https://lingui.dev
+[package]: https://www.npmjs.com/package/@huliiiiii/lingui-solid
+[badge-downloads]: https://img.shields.io/npm/dw/@huliiiiii/lingui-solid.svg
+[badge-version]: https://img.shields.io/npm/v/@huliiiiii/lingui-solid.svg
+[badge-license]: https://img.shields.io/npm/l/@huliiiiii/lingui-solid.svg

package/dist/config.d.mts

@@ -0,0 +1,6 @@
+import { LinguiConfig } from '@lingui/conf';
+export { LinguiConfig } from '@lingui/conf';
+
+declare function defineConfig(config: LinguiConfig): LinguiConfig;
+
+export { defineConfig };

package/dist/config.mjs

@@ -0,0 +1,31 @@
+import { defineConfig as defineConfig$1 } from '@lingui/conf';
+
+const solidRuntimeModules = {
+  Trans: ["@huliiiiii/lingui-solid", "Trans"],
+  useLingui: ["@huliiiiii/lingui-solid", "useLingui"]
+};
+function defineConfig(config) {
+  const {
+    runtimeConfigModule,
+    macro,
+    ...rest
+  } = config;
+  const runtimeConfig = Array.isArray(runtimeConfigModule) ? {
+    i18n: runtimeConfigModule
+  } : runtimeConfigModule;
+  const jsxPackage = macro?.jsxPackage ? Array.from([...macro.jsxPackage, "@huliiiiii/lingui-solid/macro"]) : ["@huliiiiii/lingui-solid/macro"];
+  return defineConfig$1({
+    ...rest,
+    macro: {
+      ...macro,
+      jsxPackage,
+      jsxRuntime: macro?.jsxRuntime ?? "solid"
+    },
+    runtimeConfigModule: {
+      ...solidRuntimeModules,
+      ...runtimeConfig
+    }
+  });
+}
+
+export { defineConfig };

package/dist/index.d.mts

@@ -0,0 +1,43 @@
+import * as solid_js from 'solid-js';
+import { JSXElement, ParentComponent, Component, Accessor, ParentProps } from 'solid-js';
+import { MessageOptions, I18n } from '@lingui/core';
+
+type TransRenderProps = {
+    id: string;
+    translation: JSXElement;
+    children: JSXElement;
+    message?: string | null;
+};
+type TransRenderCallbackOrComponent = {
+    component?: never;
+    render?: ((props: TransRenderProps) => JSXElement) | null;
+} | {
+    component?: Component<TransRenderProps> | null;
+    render?: never;
+};
+type TransProps = {
+    id: string;
+    message?: string;
+    values?: Record<string, unknown>;
+    components?: Record<string, ParentComponent>;
+    formats?: MessageOptions["formats"];
+    comment?: string;
+} & TransRenderCallbackOrComponent;
+
+type I18nContext = {
+    i18n: Accessor<I18n>;
+    _: I18n["_"];
+    defaultComponent?: Accessor<Component<TransRenderProps> | undefined>;
+};
+type I18nProviderProps = ParentProps<{
+    i18n: I18n;
+    defaultComponent?: Component<TransRenderProps>;
+}>;
+declare const LinguiContext: solid_js.Context<I18nContext | null>;
+declare function useLingui(): I18nContext;
+declare function I18nProvider(props: I18nProviderProps): JSXElement;
+
+declare function Trans(props: TransProps): JSXElement;
+
+export { I18nProvider, LinguiContext, Trans, useLingui };
+export type { I18nContext, I18nProviderProps, TransProps, TransRenderCallbackOrComponent, TransRenderProps };

package/dist/index.mjs

@@ -0,0 +1,214 @@
+import { createComponent, memo, mergeProps } from 'solid-js/web';
+import { createContext, createSignal, createMemo, createEffect, on, onCleanup, Show, useContext, createComponent as createComponent$1 } from 'solid-js';
+
+const LinguiContext = createContext(null);
+const useLinguiInternal = devErrorMessage => {
+  const context = useContext(LinguiContext);
+  if (process.env.NODE_ENV !== "production" && context == null) {
+    throw new Error(devErrorMessage ?? "useLingui hook was used without I18nProvider.");
+  }
+  return context;
+};
+function useLingui() {
+  return useLinguiInternal();
+}
+function I18nProvider(props) {
+  const [latestKnownLocale, setLatestKnownLocale] = createSignal(props.i18n.locale || null);
+  const [i18nSignal, setI18nSignal] = createSignal(props.i18n, {
+    equals: false
+  });
+  const defaultComponent = createMemo(() => props.defaultComponent);
+  const translate = (...args) => {
+    const i18n = i18nSignal();
+    return i18n.t(...args);
+  };
+  const context = {
+    i18n: i18nSignal,
+    _: translate,
+    defaultComponent
+  };
+  createEffect(on(() => props.i18n, (i18n, previousI18n) => {
+    const previousKnownI18n = previousI18n ?? i18n;
+    const contextNeedsUpdate = () => previousKnownI18n !== i18n || latestKnownLocale() !== i18n.locale;
+    const updateContext = () => {
+      setLatestKnownLocale(i18n.locale || null);
+      setI18nSignal(() => i18n);
+    };
+    const unsubscribe = i18n.on("change", updateContext);
+    if (contextNeedsUpdate()) {
+      updateContext();
+    }
+    onCleanup(unsubscribe);
+  }));
+  const RenderFallback = () => {
+    if (process.env.NODE_ENV === "development") {
+      console.log("I18nProvider rendered `null`. A call to `i18n.activate` needs to happen in order for translations to be activated and for the I18nProvider to render.This is not an error but an informational message logged only in development.");
+    }
+    return null;
+  };
+  return createComponent(Show, {
+    get when() {
+      return latestKnownLocale() !== null;
+    },
+    get fallback() {
+      return createComponent(RenderFallback, {});
+    },
+    get children() {
+      return createComponent(LinguiContext.Provider, {
+        value: context,
+        get children() {
+          return props.children;
+        }
+      });
+    }
+  });
+}
+
+const tagRe = /<([a-zA-Z0-9]+)>([\s\S]*?)<\/\1>|<([a-zA-Z0-9]+)\/>/;
+function formatElements(value, elements = {}) {
+  const parts = value.split(tagRe);
+  if (parts.length === 1) return value;
+  const tree = [];
+  const before = parts.shift();
+  if (before) tree.push(before);
+  for (const [index, children, after] of getElements(parts)) {
+    const element = index === void 0 ? void 0 : elements[index];
+    const formattedChildren = children ? formatElements(children, elements) : void 0;
+    if (!element) {
+      console.error(`Can't use element at index '${index}' as it is not declared in the original translation`);
+      if (formattedChildren !== void 0) {
+        tree.push(formattedChildren);
+      }
+    } else {
+      tree.push(createComponent$1(element, {
+        children: formattedChildren
+      }));
+    }
+    if (after) tree.push(after);
+  }
+  return tree.length === 1 ? tree[0] : tree;
+}
+function getElements(parts) {
+  if (!parts.length) return [];
+  const [paired, children, unpaired, after] = parts.slice(0, 4);
+  const triple = [paired || unpaired, children || "", after];
+  return [triple].concat(getElements(parts.slice(4, parts.length)));
+}
+
+function TransNoContext(props) {
+  const translation = createMemo(() => {
+    const {
+      values,
+      components
+    } = getInterpolationValuesAndComponents(props);
+    const i18n = props.lingui.i18n();
+    const _translation = i18n != null && typeof i18n._ === "function" ? i18n._(props.id, values, {
+      message: props.message,
+      formats: props.formats
+    }) : props.id;
+    const translation2 = _translation ? formatElements(_translation, components) : null;
+    return translation2;
+  });
+  const FallbackComponent = createMemo(() => {
+    return props.lingui.defaultComponent?.() || RenderChildren;
+  });
+  const i18nProps = {
+    get id() {
+      return props.id;
+    },
+    get message() {
+      return props.message;
+    },
+    get translation() {
+      return translation();
+    },
+    get children() {
+      return translation();
+    }
+  };
+  createEffect(() => {
+    const render = props.render;
+    const component = props.component;
+    if (render && component) {
+      console.error("You can't use both `component` and `render` prop at the same time. `component` is ignored.");
+    } else if (render && typeof render !== "function") {
+      console.error(`Invalid value supplied to prop \`render\`. It must be a function, provided ${render}`);
+    } else if (component && typeof component !== "function") {
+      console.error(`Invalid value supplied to prop \`component\`. It must be a Solid component, provided ${component}`);
+    }
+  });
+  const renderPropOutput = createMemo(() => {
+    if (typeof props.render === "function") {
+      return props.render(i18nProps);
+    }
+    return null;
+  });
+  const Component = createMemo(() => {
+    if (props.component && typeof props.component !== "function") {
+      return FallbackComponent();
+    }
+    return props.component || FallbackComponent();
+  });
+  const content = createMemo(() => {
+    if (props.render === null || props.component === null) {
+      return translation();
+    }
+    if (typeof props.render === "function") {
+      return renderPropOutput();
+    }
+    return createComponent$1(Component(), i18nProps);
+  });
+  return memo(content);
+}
+const RenderChildren = props => {
+  return memo(() => props.children);
+};
+const getInterpolationValuesAndComponents = props => {
+  if (!props.values) {
+    return {
+      values: void 0,
+      components: props.components
+    };
+  }
+  const values = {
+    ...props.values
+  };
+  const components = {
+    ...props.components
+  };
+  Object.entries(props.values).forEach(([key, valueForKey]) => {
+    if (typeof valueForKey === "string" || typeof valueForKey === "number") {
+      return;
+    }
+    if (valueForKey == null || typeof valueForKey === "boolean") {
+      values[key] = "";
+      return;
+    }
+    const index = Object.keys(components).length;
+    components[index] = () => valueForKey;
+    values[key] = `<${index}/>`;
+  });
+  return {
+    values,
+    components
+  };
+};
+
+function Trans(props) {
+  let errMessage = void 0;
+  if (process.env.NODE_ENV !== "production") {
+    errMessage = `Trans component was rendered without I18nProvider.
+Attempted to render message: ${props.message} id: ${props.id}. Make sure this component is rendered inside a I18nProvider.`;
+  }
+  const lingui = useLinguiInternal(errMessage);
+  return createComponent(TransNoContext, mergeProps(props, {
+    get lingui() {
+      return {
+        i18n: lingui.i18n,
+        defaultComponent: lingui.defaultComponent
+      };
+    }
+  }));
+}
+
+export { I18nProvider, LinguiContext, Trans, useLingui };

package/macro/browser.mjs

@@ -0,0 +1,11 @@
+export const Trans = function () {}
+export const Plural = function () {}
+export const Select = function () {}
+export const SelectOrdinal = function () {}
+export const useLingui = function () {}
+
+throw new Error(
+  `The macro you imported from "@huliiiiii/lingui-solid/macro" is being executed outside the context of compilation. \n` +
+    `This indicates that you don't configured correctly one of the "babel-plugin-macros" / "@lingui/swc-plugin" / "babel-plugin-lingui-macro" \n` +
+    "Additionally, dynamic imports — e.g., `await import('@huliiiiii/lingui-solid/macro')` — are not supported.",
+)

package/macro/index.d.mts

@@ -0,0 +1,134 @@
+import type { JSXElement } from "solid-js"
+import type { TransRenderCallbackOrComponent, I18nContext } from "@huliiiiii/lingui-solid"
+import type {
+  LabeledExpression,
+  MacroMessageDescriptor,
+} from "@lingui/core/macro"
+
+type CommonProps = TransRenderCallbackOrComponent & {
+  id?: string
+  comment?: string
+  context?: string
+}
+
+type TransChildren = JSXElement | LabeledExpression<string | number>
+type TransProps = {
+  children: TransChildren | TransChildren[]
+} & CommonProps
+
+type PluralChoiceProps = {
+  value: string | number | LabeledExpression<string | number>
+  offset?: number
+  zero?: JSXElement
+  one?: JSXElement
+  two?: JSXElement
+  few?: JSXElement
+  many?: JSXElement
+  other: JSXElement
+  [digit: `_${number}`]: JSXElement
+} & CommonProps
+
+type SelectChoiceProps = {
+  value: string | LabeledExpression<string | number>
+  other: JSXElement
+  [option: `_${string}`]: JSXElement
+} & CommonProps
+
+/**
+ * Trans is the basic macro for static messages,
+ * messages with variables, but also for messages with inline markup
+ *
+ * @example
+ * ```
+ * <Trans>Hello {username}. Read the <a href="/docs">docs</a>.</Trans>
+ * ```
+ * @example
+ * ```
+ * <Trans id="custom.id">Hello {username}.</Trans>
+ * ```
+ */
+export const Trans: (props: TransProps) => JSXElement
+
+/**
+ * Props of Plural macro are transformed into plural format.
+ *
+ * @example
+ * ```
+ * import { Plural } from "@lingui/core/macro"
+ * <Plural value={numBooks} one="Book" other="Books" />
+ *
+ * // ↓ ↓ ↓ ↓ ↓ ↓
+ * import { Trans } from "@huliiiiii/lingui-solid"
+ * <Trans id="{numBooks, plural, one {Book} other {Books}}" values={{ numBooks }} />
+ * ```
+ */
+export const Plural: (props: PluralChoiceProps) => JSXElement
+
+/**
+ * Props of SelectOrdinal macro are transformed into selectOrdinal format.
+ *
+ * @example
+ * ```
+ * // count == 1 -> 1st
+ * // count == 2 -> 2nd
+ * // count == 3 -> 3rd
+ * // count == 4 -> 4th
+ * <SelectOrdinal
+ *     value={count}
+ *     one="#st"
+ *     two="#nd"
+ *     few="#rd"
+ *     other="#th"
+ * />
+ * ```
+ */
+export const SelectOrdinal: (props: PluralChoiceProps) => JSXElement
+
+/**
+ * Props of Select macro are transformed into select format
+ *
+ * @example
+ * ```
+ * // gender == "female"      -> Her book
+ * // gender == "male"        -> His book
+ * // gender == "non-binary"  -> Their book
+ *
+ * <Select
+ *     value={gender}
+ *     _male="His book"
+ *     _female="Her book"
+ *     other="Their book"
+ * />
+ * ```
+ */
+export const Select: (props: SelectChoiceProps) => JSXElement
+
+/**
+ *
+ * Macro version of useLingui replaces _ function with `t` macro function which is bound to i18n passed from Solid context
+ *
+ * Returned `t` macro function has all the same signatures as global `t`
+ *
+ * @example
+ * ```
+ * const { t } = useLingui();
+ * const message = t`Text`;
+ * ```
+ *
+ * @example
+ * ```
+ * const { i18n, t } = useLingui();
+ * const locale = i18n().locale;
+ * const message = t({
+ *   id: "msg.hello",
+ *   comment: "Greetings at the homepage",
+ *   message: `Hello ${name}`,
+ * });
+ * ```
+ */
+export function useLingui(): Omit<I18nContext, "_"> & {
+  t: {
+    (descriptor: MacroMessageDescriptor): string
+    (literals: TemplateStringsArray, ...placeholders: unknown[]): string
+  }
+}

package/macro/index.mjs

@@ -0,0 +1,22 @@
+import babelPluginMacros from "babel-plugin-macros"
+import { macro } from "@lingui/babel-plugin-lingui-macro/macro"
+
+const { createMacro } = babelPluginMacros
+
+export default createMacro(macro, {
+  configName: "lingui",
+})
+
+function printError() {
+  throw new Error(
+    `The macro you imported from "@huliiiiii/lingui-solid/macro" is being executed outside the context of compilation. \n` +
+      `This indicates that you don't configured correctly one of the "babel-plugin-macros" / "@lingui/swc-plugin" / "babel-plugin-lingui-macro" \n` +
+      "Additionally, dynamic imports — e.g., `await import('@huliiiiii/lingui-solid/macro')` — are not supported.",
+  )
+}
+
+export const Trans = printError
+export const Plural = printError
+export const Select = printError
+export const SelectOrdinal = printError
+export const useLingui = printError

package/package.json

@@ -0,0 +1,91 @@
+{
+  "name": "@huliiiiii/lingui-solid",
+  "version": "6.0.0-next.3",
+  "sideEffects": false,
+  "description": "SolidJS bindings for Lingui with Trans components, providers, and compile-time macros",
+  "type": "module",
+  "author": {
+    "name": "Huliiiiii",
+    "email": "308013446a@gmail.com"
+  },
+  "license": "MIT",
+  "keywords": [
+    "lingui",
+    "linguijs",
+    "solid",
+    "solidjs",
+    "i18n",
+    "icu",
+    "messageformat",
+    "localization",
+    "translation"
+  ],
+  "scripts": {
+    "build": "unbuild",
+    "check-types": "tsc --noEmit",
+    "test": "vitest --run"
+  },
+  "homepage": "https://lingui.dev",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/lingui/js-lingui.git",
+    "directory": "packages/solid"
+  },
+  "bugs": {
+    "url": "https://github.com/lingui/js-lingui/issues"
+  },
+  "engines": {
+    "node": ">=22.19.0"
+  },
+  "exports": {
+    ".": {
+      "default": "./dist/index.mjs"
+    },
+    "./config": {
+      "types": "./dist/config.d.mts",
+      "default": "./dist/config.mjs"
+    },
+    "./macro": {
+      "browser": "./macro/browser.mjs",
+      "types": "./macro/index.d.mts",
+      "default": "./macro/index.mjs"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "LICENSE",
+    "README.md",
+    "dist/",
+    "macro/browser.mjs",
+    "macro/index.d.mts",
+    "macro/index.mjs"
+  ],
+  "peerDependencies": {
+    "babel-plugin-macros": "2 || 3",
+    "solid-js": "^1.8.0 || ^1.9.0"
+  },
+  "peerDependenciesMeta": {
+    "babel-plugin-macros": {
+      "optional": true
+    }
+  },
+  "dependencies": {
+    "@lingui/babel-plugin-lingui-macro": "6.0.0-next.3",
+    "@lingui/conf": "6.0.0-next.3",
+    "@lingui/core": "6.0.0-next.3"
+  },
+  "devDependencies": {
+    "@babel/core": "7.29.0",
+    "@lingui/test-utils": "3.0.3",
+    "@rollup/plugin-babel": "7.0.0",
+    "@solidjs/testing-library": "^0.8.10",
+    "babel-preset-solid": "1.9.12",
+    "eslint": "^9.39.3",
+    "happy-dom": "^20.0.10",
+    "solid-js": "^1.9.5",
+    "unbuild": "3.6.1",
+    "vite": "7.3.1",
+    "vite-plugin-solid": "^2.11.12",
+    "vitest": "4.0.18"
+  }
+}