From 82a4f557e76b75a9d5e32e6105d58e117f376ea4 Mon Sep 17 00:00:00 2001 From: adueck Date: Fri, 23 Sep 2022 14:39:44 +0400 Subject: [PATCH] issure with mapJSX single child - still ugly though --- package.json | 2 +- src/lib/jsx-map.test.tsx | 8 ++++++- src/lib/jsx-map.tsx | 47 +++++++++++----------------------------- 3 files changed, 21 insertions(+), 36 deletions(-) diff --git a/package.json b/package.json index f647198..d3b3cb5 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@lingdocs/pashto-inflector", - "version": "4.0.1", + "version": "4.0.2", "author": "lingdocs.com", "description": "A Pashto inflection and verb conjugation engine, inculding React components for displaying Pashto text, inflections, and conjugations", "homepage": "https://verbs.lingdocs.com", diff --git a/src/lib/jsx-map.test.tsx b/src/lib/jsx-map.test.tsx index d8b6eed..c084364 100644 --- a/src/lib/jsx-map.test.tsx +++ b/src/lib/jsx-map.test.tsx @@ -1,6 +1,6 @@ import { psJSXMap } from "./jsx-map"; -test("psJSXMap should work with f as a target", () => { +test("psJSXMap should work with p as a target", () => { const input = { p: <>زه کور ته ځم, f: <>zu kor ta dzum }; const output = psJSXMap(input, "p", (ps) => ps.p.replace(/ځ/g, "ز")); expect(output).toEqual(<>زه کور ته زم); @@ -12,6 +12,12 @@ test("psJSXMap should work with f as a target", () => { expect(output).toEqual(<>zu kor ta zum); }); +test("psJSXMap should work with single child", () => { + const input = { p:
کور
, f:
kor
}; + const output = psJSXMap(input, "f", (ps) => ps.f.replace(/k/g, "q")); + expect(output).toEqual(
qor
); +}); + test("psJSXMap will error if given an uneven/unbalanced pair of JSX Elements", () => { expect(() => { const input = { p: <>زه کور ته ځم, f: <>zu kor ta dzum }; diff --git a/src/lib/jsx-map.tsx b/src/lib/jsx-map.tsx index ab6609f..4576c1d 100644 --- a/src/lib/jsx-map.tsx +++ b/src/lib/jsx-map.tsx @@ -26,13 +26,16 @@ export function psJSXMap(ps: T.PsJSX, target: "p" | "f", dealWithString: (ps: T. return { ...base, props: { + // TODO: could make this a lot cleaner/less repetitive by following a better recursive formula + // see https://adueck.github.io/blog/recursively-modify-text-jsx-react/ ...base.props, children: typeof base.props.children === "string" ? dealWithString({ p: (target === "p" ? base : sec).props.children, f: (target === "p" ? sec : base).props.children, }) - : base.props.children.map((x: string | JSX.Element, i: number) => ( + : base.props.children.map + ? base.props.children.map((x: string | JSX.Element, i: number) => ( (typeof x === "string") ? dealWithString({ p: (target === "p" ? x : sec.props.children[i]), @@ -42,7 +45,15 @@ export function psJSXMap(ps: T.PsJSX, target: "p" | "f", dealWithString: (ps: T. p: (target === "p" ? x : sec.props.children[i]), f: (target === "p" ? sec.props.children[i] : x), }, target, dealWithString) - )), + )) : (typeof base.props.children === "string") + ? dealWithString({ + p: (target === "p" ? base.props.children : sec.props.children), + f: (target === "p" ? sec.props.children : base.props.children), + }) + : psJSXMap({ + p: (target === "p" ? base.props.children : sec.props.children), + f: (target === "p" ? sec.props.children : base.props.children), + }, target, dealWithString) }, }; } catch (e) { @@ -50,35 +61,3 @@ export function psJSXMap(ps: T.PsJSX, target: "p" | "f", dealWithString: (ps: T. throw new Error("error mapping out PsJSX - unbalanced trees"); } } - -// UNUSED POC OF THE BASIC JSXMAP - COULD BE PUBLISHED SEPERATELY - -/** - * Allows a text transform function to be run over all the text in a JSX element - * - * @param e a JSX Element - * @param f a function to transform the text - * @returns the JSX Element with all the text transformed - */ - export function JSXTextTransform( - e: JSX.Element | string, - f: (s: string) => string - ): JSX.Element | string { - if (typeof e === "string") { - return f(e); - } - return { - ...e, - props: { - ...e.props, - children: - typeof e.props.children === "string" - ? f(e.props.children) - : Array.isArray(e.props.children) - ? e.props.children.map((x: string | JSX.Element) => ( - JSXTextTransform(x, f) - )) - : JSXTextTransform(e.props.children, f) - } - }; - } \ No newline at end of file