up

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lingdocs/pashto-inflector",
-  "version": "3.0.6",
+  "version": "3.0.7",
   "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",

src/components/ep-explorer/EPDisplay.tsx

@@ -14,7 +14,7 @@ function EPDisplay({ eps, opts, setOmitSubject, justify, onlyOne }: {
     opts: T.TextOptions,
     setOmitSubject: ((value: "true" | "false") => void) | false
     justify?: "left" | "right" | "center",
-    onlyOne?: boolean,
+    onlyOne?: boolean | "concat",
 }) {
     const [mode, setMode] = useState<Mode>("text");
     const [script, setScript] = useStickyState<"p" | "f">("f", "blockScriptChoice");
@@ -54,10 +54,14 @@ function EPDisplay({ eps, opts, setOmitSubject, justify, onlyOne }: {
             <div />
         </div>
         {mode === "text"
-            ? <CompiledPTextDisplay opts={opts} compiled={result} justify={justify} onlyOne={onlyOne} />
+            ? <CompiledPTextDisplay opts={opts} compiled={result} justify={justify} onlyOne={!!onlyOne} />
             : <EPBlocksDisplay opts={opts} rendered={rendered} justify={justify} script={script} />}
         {result.e && <div className={`text-muted mt-2 text-${justify === "left" ? "left" : justify === "right" ? "right" : "center"}`}>
-            {(onlyOne ? [result.e[0]] : result.e).map((e, i) => <div key={i}>{e}</div>)}
+            {onlyOne === "concat"
+                ? result.e.join(" • ")
+                : onlyOne
+                ? [result.e[0]]
+                : result.e.map((e, i) => <div key={i}>{e}</div>)}
         </div>}
         {EP.predicate.selection.selection.type === "participle" && <div style={{ maxWidth: "6 00px", margin: "0 auto" }} className="alert alert-warning mt-3 pt-4">
             <p>⚠️ NOTE: This means that the subject {renderedSubject.selection.e ? `(${renderedSubject.selection.e})` : ""} is <strong>the action/idea</strong> of

src/components/vp-explorer/VPDisplay.tsx

@@ -13,9 +13,9 @@ import useStickyState from "../../lib/useStickyState";
 function VPDisplay({ VPS, opts, setForm, justify, onlyOne }: {
     VPS: T.VPSelectionState,
     opts: T.TextOptions,
-    setForm: (form: T.FormVersion) => void,
+    setForm: "disable" | ((form: T.FormVersion) => void),
     justify?: "left" | "right" | "center",
-    onlyOne?: boolean,
+    onlyOne?: boolean | "concat",
 }) {
     const [mode, setMode] = useState<Mode>("text");
     const [script, setScript] = useStickyState<"p" | "f">("f", "blockScriptChoice");
@@ -35,20 +35,24 @@ function VPDisplay({ VPS, opts, setForm, justify, onlyOne }: {
     const rendered = renderVP(VP);
     const result = compileVP(rendered, rendered.form);
     return <div className="text-center mt-1">
-        <AbbreviationFormSelector
+        {typeof setForm === "function" && <AbbreviationFormSelector
             adjustable={rendered.whatsAdjustable}
             form={rendered.form}
             onChange={setForm}
-        />
+        />}
         <div className="d-flex flex-row">
             <ModeSelect value={mode} onChange={setMode} />
             {mode === "blocks" && <ScriptSelect value={script} onChange={setScript} />}
         </div>
         {mode === "text"
-            ? <CompiledPTextDisplay opts={opts} compiled={result} justify={justify} onlyOne={onlyOne} />
+            ? <CompiledPTextDisplay opts={opts} compiled={result} justify={justify} onlyOne={!!onlyOne} />
             : <RenderedBlocksDisplay opts={opts} rendered={rendered} justify={justify} script={script} />}
-        {result.e && <div className="text-muted mt-3">
+        {result.e && <div className={`text-muted mt-2 text-${justify === "left" ? "left" : justify === "right" ? "right" : "center"}`}>
-            {result.e.map((e, i) => <div key={i}>{e}</div>)}
+            {onlyOne === "concat"
+                ? result.e.join(" • ")
+                : onlyOne
+                ? [result.e[0]]
+                : result.e.map((e, i) => <div key={i}>{e}</div>)}
         </div>}
     </div>
 }