@saykit/react 0.1.0 → 0.2.0

package/README.md

@@ -2,6 +2,8 @@
 
 > React integration for [SayKit](https://saykit.js.org).
 
+[![Coverage](https://codecov.io/gh/k0d13/saykit/graph/badge.svg?flag=integration-react)](https://codecov.io/gh/k0d13/saykit?flags%5B0%5D=integration-react)
+
 A `<Say>` component for rendering translated content in server and client components, a `<SayProvider>` and `useSay()` for client trees, and a small server runtime (`setSay`, `getSay`, `unstable_createWithSay`).
 
 ## Install

package/dist/index.client.mjs

@@ -1,8 +1,10 @@
 "use client"; import { useSay as GET_SAY } from "./client.mjs";import { Fragment, cloneElement, createElement, isValidElement } from "react";
 //#region src/components/renderer.ts
-function Renderer({ html, components }) {
+function Renderer({ html, components, whitespace = true }) {
 	function getComponent(tag) {
-		if (typeof components === "function") return components(tag) ?? tag ?? Fragment;
+		if (typeof components === "function")
+ /* v8 ignore next */
+		return components(tag) ?? tag ?? Fragment;
 		return tag && tag in components ? components[tag] : Fragment;
 	}
 	let nodeKey = 0;
@@ -36,7 +38,7 @@ function Renderer({ html, components }) {
 			let textEnd = input.indexOf("<", i);
 			if (textEnd === -1) textEnd = input.length;
 			const text = input.slice(i, textEnd);
-			current.push(text);
+			if (whitespace || text.trim() !== "") current.push(text);
 			i = textEnd;
 		}
 		return current;
@@ -56,9 +58,11 @@ function resolveJsxSafePropKeys(props) {
 function Say(props) {
 	if (!("id" in props)) throw new Error("'Say' is a macro and must be used with the relevant saykit plugin", { cause: /* @__PURE__ */ new Error("The 'id' property is required for a descriptor") });
 	const say = GET_SAY();
-	const descriptor = resolveJsxSafePropKeys(props);
+	const { whitespace, ...rest } = props;
+	const descriptor = resolveJsxSafePropKeys(rest);
 	return createElement(Renderer, {
 		html: say.call(descriptor),
+		whitespace,
 		components(tag) {
 			if (tag && tag in descriptor && isValidElement(descriptor[tag])) {
 				const element = descriptor[tag];

package/dist/index.d.mts

@@ -14,6 +14,7 @@ type PropsWithJSXSafeKeys<T> = { [K in keyof T as K extends number | `${number}$
  */
 declare function Say(props: PropsWithChildren<Disallow<{
   context?: string;
+  whitespace?: boolean;
 }, 'id'>>): ReactElement;
 declare namespace Say {
   /**

package/dist/index.server.mjs

@@ -1,8 +1,10 @@
 import { getSay as GET_SAY } from "./server.mjs";import { Fragment, cloneElement, createElement, isValidElement } from "react";
 //#region src/components/renderer.ts
-function Renderer({ html, components }) {
+function Renderer({ html, components, whitespace = true }) {
 	function getComponent(tag) {
-		if (typeof components === "function") return components(tag) ?? tag ?? Fragment;
+		if (typeof components === "function")
+ /* v8 ignore next */
+		return components(tag) ?? tag ?? Fragment;
 		return tag && tag in components ? components[tag] : Fragment;
 	}
 	let nodeKey = 0;
@@ -36,7 +38,7 @@ function Renderer({ html, components }) {
 			let textEnd = input.indexOf("<", i);
 			if (textEnd === -1) textEnd = input.length;
 			const text = input.slice(i, textEnd);
-			current.push(text);
+			if (whitespace || text.trim() !== "") current.push(text);
 			i = textEnd;
 		}
 		return current;
@@ -56,9 +58,11 @@ function resolveJsxSafePropKeys(props) {
 function Say(props) {
 	if (!("id" in props)) throw new Error("'Say' is a macro and must be used with the relevant saykit plugin", { cause: /* @__PURE__ */ new Error("The 'id' property is required for a descriptor") });
 	const say = GET_SAY();
-	const descriptor = resolveJsxSafePropKeys(props);
+	const { whitespace, ...rest } = props;
+	const descriptor = resolveJsxSafePropKeys(rest);
 	return createElement(Renderer, {
 		html: say.call(descriptor),
+		whitespace,
 		components(tag) {
 			if (tag && tag in descriptor && isValidElement(descriptor[tag])) {
 				const element = descriptor[tag];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@saykit/react",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "React integration for saykit, i18n hooks and components",
   "keywords": [
     "i18n",
@@ -46,9 +46,11 @@
     "server-only": "^0.0.1"
   },
   "devDependencies": {
-    "@types/react": "^19.2.14",
-    "react": "^19.2.6",
-    "saykit": "^0.1.0"
+    "@types/react": "^19.2.17",
+    "@types/react-dom": "^19.2.3",
+    "react": "^19.2.7",
+    "react-dom": "^19.2.7",
+    "saykit": "^0.2.0"
   },
   "peerDependencies": {
     "react": "*",