diff --git a/package.json b/package.json index fb323a1..25718d5 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@lingdocs/pashto-inflector", - "version": "0.3.8", + "version": "0.3.9", "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/App.css b/src/App.css index 8a12cf3..72801e4 100644 --- a/src/App.css +++ b/src/App.css @@ -91,10 +91,6 @@ hr { max-width: 700px; } -.thin-column { - max-width: 1rem; -} - .word { margin-bottom: 1.25rem; } diff --git a/src/App.tsx b/src/App.tsx index 24a7488..bbe7969 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -191,7 +191,7 @@ function App() { console.log(textOptions); return <>
-
+
{ @@ -49,50 +49,20 @@ const InflectionTable = ({ inf, textOptions }: {
- +
- - {"masc" in inf && } - {"fem" in inf && } + + {"masc" in inf && } + {"fem" in inf && } {["Plain", "1st", "2nd"].map((title, i) => ( - - {"masc" in inf && } - {"fem" in inf && } + + {"masc" in inf && } + {"fem" in inf && } ))} diff --git a/src/components/TableCell.tsx b/src/components/TableCell.tsx new file mode 100644 index 0000000..5498c91 --- /dev/null +++ b/src/components/TableCell.tsx @@ -0,0 +1,50 @@ +import { useState, useEffect } from "react"; +import * as T from "../types"; +import Pashto from "./Pashto"; +import Phonetics from "./Phonetics"; + +const arrowDown = + +; + +function TableCell({ item, textOptions, center, noBorder }: { + item: T.ArrayOneOrMore, + textOptions: T.TextOptions, + center?: boolean, + noBorder?: boolean, +}) { + const [version, setVersion] = useState(0); + useEffect(() => setVersion(0), [item]); + function advanceVersion() { + setVersion((version + 1) % item.length); + } + const w = item[version] || item[0]; + return ( + + ); +} + +export default TableCell; \ No newline at end of file diff --git a/src/components/VerbTable.tsx b/src/components/VerbTable.tsx index c37f8e1..0469d93 100644 --- a/src/components/VerbTable.tsx +++ b/src/components/VerbTable.tsx @@ -6,9 +6,7 @@ * */ -import { useState, useEffect } from "react"; -import Pashto from "./Pashto"; -import Phonetics from "./Phonetics"; +import TableCell from "./TableCell"; import { psStringEquals, isAllOne, @@ -17,9 +15,6 @@ import { import { isSentenceForm } from "../lib/misc-helpers"; import * as T from "../types"; -const arrowDown = - -; const genderAbbrev = (gender: "masc" | "fem" | undefined): " m." | " f." | "" => ( gender === "masc" @@ -54,46 +49,6 @@ const minifyTableGender = (block: T.VerbBlock | T.ImperativeBlock): Array, - textOptions: T.TextOptions, - center?: boolean, - noBorder?: boolean, -}) { - const [version, setVersion] = useState(0); - useEffect(() => setVersion(0), [item]); - function advanceVersion() { - setVersion((version + 1) % item.length); - } - const w = item[version] || item[0]; - return ( - - ); -} - function VerbTable({ block, textOptions, english }: { block: T.VerbBlock | T.ImperativeBlock | T.ArrayOneOrMore, english?: T.EnglishBlock | string, @@ -110,7 +65,7 @@ function VerbTable({ block, textOptions, english }: { return
MasculineFeminineMasculineFeminine
{title} - {inf.masc[i].map((w, j) => ( -
-
- - {w} - -
-
- - {w} - -
-
- ))} -
- {inf.fem[i].map((w, j) => ( -
-
- - {w} - -
-
- - {w} - -
-
- ))} -
{title}
+
+
+
+ {w} +
+
+ {w} +
+ {w.e &&
{w.e}
} +
+ {item.length > 1 && + + } +
+
-
-
-
- {w} -
-
- {w} -
- {w.e &&
{w.e}
} -
- {item.length > 1 && - - } -
-
- +
@@ -139,8 +94,8 @@ function VerbTable({ block, textOptions, english }: { return ( {rowLabel} - - + + ); }