From 6282f30577f4647fe49c203f866c86ee4b3ecb69 Mon Sep 17 00:00:00 2001 From: adueck Date: Sat, 18 Feb 2023 14:22:09 +0500 Subject: [PATCH] created NPDisplay component and improved block/text selection buttons --- package-lock.json | 4 +- package.json | 2 +- src/components/library.ts | 2 + src/components/package.json | 2 +- src/components/src/DisplayModeSelect.tsx | 47 +++++++++++--- src/components/src/RenderedBlocksDisplay.tsx | 4 +- src/components/src/vp-explorer/NPDisplay.tsx | 64 ++++++++++++++++++++ src/lib/package.json | 2 +- src/lib/src/misc-helpers.ts | 2 + src/lib/src/phrase-building/render-vp.ts | 2 - 10 files changed, 113 insertions(+), 18 deletions(-) create mode 100644 src/components/src/vp-explorer/NPDisplay.tsx diff --git a/package-lock.json b/package-lock.json index 9bcbf6c..85dadf0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "pashto-inflector", - "version": "5.7.18", + "version": "5.8.0", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "pashto-inflector", - "version": "5.7.18", + "version": "5.8.0", "hasInstallScript": true, "license": "MIT", "dependencies": { diff --git a/package.json b/package.json index 7656415..a571bce 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pashto-inflector", - "version": "5.7.18", + "version": "5.8.0", "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/components/library.ts b/src/components/library.ts index df4c147..7e9181e 100644 --- a/src/components/library.ts +++ b/src/components/library.ts @@ -33,6 +33,7 @@ import EPExplorer from "./src/ep-explorer/EPExplorer"; import APPicker from "./src/ap-picker/APPicker"; import VPDisplay from "./src/vp-explorer/VPDisplay"; import VPPicker from "./src/vp-explorer/VPPicker"; +import NPDisplay from "./src/vp-explorer/NPDisplay"; import HumanReadableInflectionPattern from "./src/HumanReadableInflectionPattern"; import { psJSXMap } from "./src/jsx-map"; import genderColors from "./src/gender-colors"; @@ -66,6 +67,7 @@ export { Block, EPDisplay, VPDisplay, + NPDisplay, EPPicker, VPPicker, CompiledPTextDisplay, diff --git a/src/components/package.json b/src/components/package.json index 96bef70..543c600 100644 --- a/src/components/package.json +++ b/src/components/package.json @@ -1,6 +1,6 @@ { "name": "@lingdocs/ps-react", - "version": "5.7.18", + "version": "5.8.0", "description": "Pashto inflector library module with React components", "main": "dist/components/library.js", "module": "dist/components/library.js", diff --git a/src/components/src/DisplayModeSelect.tsx b/src/components/src/DisplayModeSelect.tsx index 480b355..bb29127 100644 --- a/src/components/src/DisplayModeSelect.tsx +++ b/src/components/src/DisplayModeSelect.tsx @@ -1,22 +1,49 @@ +import ButtonSelect from "./ButtonSelect"; + export type Mode = "text" | "blocks"; function ModeSelect({ value, onChange }: { value: Mode, onChange: (m: Mode) => void, }) { - return
- {value === "text" ?
onChange("blocks")}> - -
:
onChange("text")}> - -
} -
; + return
+ }, + { value: "blocks", label: }, + ]} + handleChange={onChange} + value={value} + small + /> +
+ + // return
+ // {value === "text" ?
onChange("blocks")}> + // + //
:
onChange("text")}> + // + //
} + //
; } export function ScriptSelect({ value, onChange }: { value: "p" | "f", onChange: (m: "p" | "f") => void }) { - return ; + return
+ +
+ // return ; } export function LengthSelect({ value, onChange }: { value: "long" | "short", onChange: (l: "long" | "short") => void }) { diff --git a/src/components/src/RenderedBlocksDisplay.tsx b/src/components/src/RenderedBlocksDisplay.tsx index 44fb23c..2dde1f8 100644 --- a/src/components/src/RenderedBlocksDisplay.tsx +++ b/src/components/src/RenderedBlocksDisplay.tsx @@ -16,7 +16,9 @@ function RenderedBlocksDisplay({ opts, rendered, justify, script }: { // useEffect(() => { // parent.current && autoAnimate(parent.current) // }, [parent]); - const blocksWVars = ("omitSubject" in rendered) + const blocksWVars: T.Block[][] = Array.isArray(rendered) + ? rendered + : ("omitSubject" in rendered) ? filterForVisibleBlocksEP(rendered.blocks, rendered.omitSubject) : filterForVisibleBlocksVP(rendered.blocks, rendered.form, rendered.king); const king = "king" in rendered ? rendered.king : undefined; diff --git a/src/components/src/vp-explorer/NPDisplay.tsx b/src/components/src/vp-explorer/NPDisplay.tsx new file mode 100644 index 0000000..1b8ee0f --- /dev/null +++ b/src/components/src/vp-explorer/NPDisplay.tsx @@ -0,0 +1,64 @@ +import * as T from "../../../types"; +import ModeSelect, { Mode, ScriptSelect } from "../DisplayModeSelect"; +import { useState } from "react"; +import CompiledPTextDisplay from "../CompiledPTextDisplay"; +import useStickyState from "../useStickyState"; +import { + getEnglishFromRendered, + getPashtoFromRendered, +} from "../../../lib/src/phrase-building/np-tools"; +import { + renderNPSelection, +} from "../../../lib/src/phrase-building/render-np"; +import { NPBlock } from "../blocks/Block"; + +function NPDisplay({ NP, inflected, opts, justify, onlyOne, mode: preferredMode, script: preferredScript }: { + NP: T.NPSelection, + opts: T.TextOptions, + justify?: "left" | "right" | "center", + onlyOne?: boolean | "concat", + mode?: Mode, + script?: "p" | "f", + inflected: boolean, +}) { + const [mode, setMode] = useState(preferredMode || "text"); + const [script, setScript] = useStickyState<"p" | "f">(preferredScript || "f", "blockScriptChoice"); + const rendered = renderNPSelection(NP, inflected, false, "subject", "none", false); + const english = getEnglishFromRendered(rendered); + const pashto = getPashtoFromRendered(rendered, false); + const result = { + ps: pashto, + e: [english || ""], + }; + return
+
+ + {mode === "blocks" && } +
+ {mode === "text" + ? + : } + {result.e &&
+ {onlyOne === "concat" + ? result.e.join(" • ") + : onlyOne + ? [result.e[0]] + : result.e.map((e, i) =>
{e}
)} +
} +
+} + +function NPBlockDisplay({ opts, np, justify, script }: { + script: "p" | "f", + opts: T.TextOptions, + np: T.Rendered, + justify?: "left" | "right" | "center", +}) { + return
+
+ {np} +
+
+} + +export default NPDisplay; \ No newline at end of file diff --git a/src/lib/package.json b/src/lib/package.json index 3fafa1a..ba28b4d 100644 --- a/src/lib/package.json +++ b/src/lib/package.json @@ -1,6 +1,6 @@ { "name": "@lingdocs/inflect", - "version": "5.7.18", + "version": "5.8.0", "description": "Pashto inflector library", "main": "dist/index.js", "types": "dist/lib/library.d.ts", diff --git a/src/lib/src/misc-helpers.ts b/src/lib/src/misc-helpers.ts index 8f27224..c46aff8 100644 --- a/src/lib/src/misc-helpers.ts +++ b/src/lib/src/misc-helpers.ts @@ -46,6 +46,7 @@ export function ensureNonComboVerbInfo(i: T.VerbInfo): T.NonComboVerbInfo { } export function pickPersInf(s: T.OptionalPersonInflections, persInf: T.PersonInflectionsField): T { + // @ts-ignore if ("mascSing" in s) { return s[persInf]; } @@ -295,6 +296,7 @@ export function parseEc(ec: string): T.EnglishVerbConjugationEc { } export function chooseLength(x: T.SingleOrLengthOpts, length: "long" | "short"): N { + // @ts-ignore if ("long" in x) { return x[length]; } diff --git a/src/lib/src/phrase-building/render-vp.ts b/src/lib/src/phrase-building/render-vp.ts index 219be19..a1b11f6 100644 --- a/src/lib/src/phrase-building/render-vp.ts +++ b/src/lib/src/phrase-building/render-vp.ts @@ -35,8 +35,6 @@ import { renderAPSelection } from "./render-ap"; import { findPossesivesToShrink, orderKids, getMiniPronounPs } from "./render-common"; import { renderComplementSelection } from "./render-complement"; import { makeNounSelection } from "./make-selections"; -// import { getVerbInfo } from "../verb-info"; -// import { grammarUnits } from "../../library"; export function renderVP(VP: T.VPSelectionComplete): T.VPRendered { const subject = getSubjectSelection(VP.blocks).selection;