forgot to get the tense-picker going again
This commit is contained in:
parent
345a03edb9
commit
e05d6f1111
|
@ -1,12 +1,12 @@
|
|||
{
|
||||
"name": "pashto-inflector",
|
||||
"version": "5.0.11",
|
||||
"version": "5.0.12",
|
||||
"lockfileVersion": 2,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "pashto-inflector",
|
||||
"version": "5.0.11",
|
||||
"version": "5.0.12",
|
||||
"hasInstallScript": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "pashto-inflector",
|
||||
"version": "5.0.11",
|
||||
"version": "5.0.12",
|
||||
"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",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@lingdocs/ps-react",
|
||||
"version": "5.0.11",
|
||||
"version": "5.0.12",
|
||||
"description": "Pashto inflector library module with React components",
|
||||
"main": "dist/components/library.js",
|
||||
"module": "dist/components/library.js",
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
// import Select from "react-select";
|
||||
import Select from "react-select";
|
||||
import * as T from "../../../types";
|
||||
// import ButtonSelect from "../ButtonSelect";
|
||||
import ButtonSelect from "../ButtonSelect";
|
||||
import { isImperativeTense, isModalTense, isPerfectTense, isVerbTense } from "../../../lib/src/type-predicates";
|
||||
// import useStickyState from "../../lib/useStickyState";
|
||||
// import { customStyles } from "../EntrySelect";
|
||||
import useStickyState from "../useStickyState";
|
||||
import { customStyles } from "../EntrySelect";
|
||||
import {
|
||||
VpsReducerAction
|
||||
} from "../../../lib/src/phrase-building/vps-reducer";
|
||||
|
@ -42,15 +42,15 @@ const verbTenseOptions: { label: string | JSX.Element, value: T.VerbTense, formu
|
|||
formula: "ba + simple past",
|
||||
}];
|
||||
|
||||
// function composeFormula(formula: string, prefix: "passive" | "ability"): string {
|
||||
// return formula.replace(/^perfective/, `${prefix} perfective`)
|
||||
// .replace(/^imperfective/, `${prefix} imperfective`)
|
||||
// .replace("continuous", `${prefix} continuous`)
|
||||
// .replace("simple", `${prefix} simple`)
|
||||
// .replace(/present$/, `${prefix} present`)
|
||||
// .replace(/subjunctive$/, `${prefix} subjunctive`)
|
||||
// .replace("past participle", `${prefix} past participle`);
|
||||
// }
|
||||
function composeFormula(formula: string, prefix: "passive" | "ability"): string {
|
||||
return formula.replace(/^perfective/, `${prefix} perfective`)
|
||||
.replace(/^imperfective/, `${prefix} imperfective`)
|
||||
.replace("continuous", `${prefix} continuous`)
|
||||
.replace("simple", `${prefix} simple`)
|
||||
.replace(/present$/, `${prefix} present`)
|
||||
.replace(/subjunctive$/, `${prefix} subjunctive`)
|
||||
.replace("past participle", `${prefix} past participle`);
|
||||
}
|
||||
|
||||
const perfectTenseOptions: { label: string | JSX.Element, value: T.PerfectTense, formula: string }[] = [{
|
||||
label: "Present Perfect",
|
||||
|
@ -124,176 +124,175 @@ function TensePicker(props: ({
|
|||
onChange: (p: VpsReducerAction) => void,
|
||||
mode: "charts" | "phrases" | "quiz",
|
||||
}) {
|
||||
return <div>not here</div>
|
||||
// const [showFormula, setShowFormula] = useStickyState<boolean>(false, "showFormula");
|
||||
// function onTenseSelect(o: { value: T.VerbTense | T.PerfectTense | T.ImperativeTense } | null) {
|
||||
// if ("vpsComplete" in props) return;
|
||||
// const tense = o?.value ? o.value : undefined;
|
||||
// props.onChange({
|
||||
// type: "set tense",
|
||||
// payload: tense,
|
||||
// });
|
||||
// }
|
||||
// function moveTense(dir: "forward" | "back") {
|
||||
// if ("vpsComplete" in props) return;
|
||||
// if (!props.vps.verb) return;
|
||||
// return () => {
|
||||
// // TODO: ABSTRACT THIS - SAFER
|
||||
// const tenses = props.vps.verb.tenseCategory === "perfect"
|
||||
// ? perfectTenseOptions
|
||||
// : props.vps.verb.tenseCategory === "imperative"
|
||||
// ? imperativeTenseOptions
|
||||
// : verbTenseOptions;
|
||||
// const currIndex = tenses.findIndex(tn => tn.value === props.vps.verb[
|
||||
// // TODO: ABSTRACT THIS? - SAFER
|
||||
// props.vps.verb.tenseCategory === "perfect"
|
||||
// ? "perfectTense"
|
||||
// : props.vps.verb.tenseCategory === "imperative"
|
||||
// ? "imperativeTense"
|
||||
// : "verbTense"
|
||||
// ]);
|
||||
// if (currIndex === -1) {
|
||||
// console.error("error moving tense", dir);
|
||||
// return;
|
||||
// }
|
||||
// const newIndex = dir === "forward"
|
||||
// ? ((currIndex + 1) % tenses.length)
|
||||
// : (currIndex === 0 ? (tenses.length - 1) : (currIndex - 1))
|
||||
// const newTense = tenses[newIndex];
|
||||
// onTenseSelect(newTense);
|
||||
// };
|
||||
// }
|
||||
// function onPosNegSelect(payload: "true" | "false") {
|
||||
// if ("vpsComplete" in props) return;
|
||||
// props.onChange({
|
||||
// type: "set negativity",
|
||||
// payload,
|
||||
// });
|
||||
// }
|
||||
// function onTenseCategorySelect(payload: "basic" | "modal" | "perfect" | "imperative") {
|
||||
// if ("vpsComplete" in props) return;
|
||||
// props.onChange({
|
||||
// type: "set tense category",
|
||||
// payload,
|
||||
// });
|
||||
// }
|
||||
// const tOptions = ("vps" in props && (props.vps.verb?.tenseCategory === "perfect"))
|
||||
// ? perfectTenseOptions
|
||||
// : ("vps" in props && (props.vps.verb?.tenseCategory === "imperative"))
|
||||
// ? imperativeTenseOptions
|
||||
// : verbTenseOptions;
|
||||
// const showImperativeOption = ("vps" in props && props.vps.verb.voice === "active")
|
||||
// || ("vpsComplete" in props && props.vpsComplete.verb.voice !== "active");
|
||||
// const inPassiveVoice = ("vps" in props && props.vps.verb.voice === "passive") || ("vpsComplete" in props && props.vpsComplete.verb.voice === "passive");;
|
||||
// const canHaveFormula = "vps" in props && props.mode !== "quiz";
|
||||
// return <div>
|
||||
// <div style={{ maxWidth: "300px", minWidth: "250px", margin: "0 auto" }}>
|
||||
// <div className="d-flex flex-row justify-content-between align-items-center">
|
||||
// <div className="h5">Verb Tense:</div>
|
||||
// {canHaveFormula && <div className="clickable mb-2 small" onClick={() => setShowFormula(x => !x)}>
|
||||
// 🧪 {!showFormula ? "Show" : "Hide"} Formula
|
||||
// </div>}
|
||||
// </div>
|
||||
// {("vpsComplete" in props || props.vps.verb) && <div className="mb-2">
|
||||
// <ButtonSelect
|
||||
// small
|
||||
// value={"vpsComplete" in props
|
||||
// ? getTenseCategory(props.vpsComplete.verb.tense)
|
||||
// : props.vps.verb.tenseCategory}
|
||||
// // @ts-ignore
|
||||
// options={showImperativeOption ? [{
|
||||
// label: "Basic",
|
||||
// value: "basic",
|
||||
// }, {
|
||||
// label: "Perfect",
|
||||
// value: "perfect",
|
||||
// }, {
|
||||
// label: "Ability",
|
||||
// value: "modal",
|
||||
// }, {
|
||||
// label: "Imperative",
|
||||
// value: "imperative",
|
||||
// }] : [{
|
||||
// label: "Basic",
|
||||
// value: "basic",
|
||||
// }, {
|
||||
// label: "Perfect",
|
||||
// value: "perfect",
|
||||
// }, {
|
||||
// label: "Ability",
|
||||
// value: "modal",
|
||||
// }].filter(x => !(inPassiveVoice && x.value === "modal"))}
|
||||
// handleChange={props.mode !== "quiz" ? onTenseCategorySelect : () => null}
|
||||
// />
|
||||
// </div>}
|
||||
// {"vpsComplete" in props
|
||||
// ? <div style={{ fontSize: "larger" }} className="mb-3">
|
||||
// {[...verbTenseOptions, ...perfectTenseOptions, ...imperativeTenseOptions].find(o => o.value === props.vpsComplete.verb.tense)?.label}
|
||||
// </div>
|
||||
// : <>
|
||||
// <Select
|
||||
// isSearchable={false}
|
||||
// // for some reason can't use tOptions with find here;
|
||||
// value={props.vps.verb && ([...verbTenseOptions, ...perfectTenseOptions, ...imperativeTenseOptions].find(o => o.value === props.vps.verb[
|
||||
// props.vps.verb.tenseCategory === "perfect"
|
||||
// ? "perfectTense"
|
||||
// : props.vps.verb.tenseCategory === "imperative"
|
||||
// ? "imperativeTense"
|
||||
// : "verbTense"
|
||||
// ]))}
|
||||
// // @ts-ignore - gets messed up when using customStyles
|
||||
// onChange={onTenseSelect}
|
||||
// className="mb-2"
|
||||
// options={tOptions}
|
||||
// styles={customStyles}
|
||||
// />
|
||||
// </>}
|
||||
// {"vps" in props && props.vps.verb && (props.mode !== "quiz") && <div className="d-flex flex-row justify-content-between align-items-center mt-2 mb-1" style={{ width: "100%" }}>
|
||||
// <div className="btn btn-light clickable" onClick={moveTense("back")}>
|
||||
// <i className="fas fa-chevron-left" />
|
||||
// </div>
|
||||
// {props.mode === "phrases" && <ButtonSelect
|
||||
// small
|
||||
// value={props.vps.verb.negative.toString() as "true" | "false"}
|
||||
// options={[{
|
||||
// label: "Pos.",
|
||||
// value: "false",
|
||||
// }, {
|
||||
// label: "Neg.",
|
||||
// value: "true",
|
||||
// }]}
|
||||
// handleChange={onPosNegSelect}
|
||||
// />}
|
||||
// <div onClick={moveTense("forward")} className="btn btn-light clickable">
|
||||
// <i className="fas fa-chevron-right" />
|
||||
// </div>
|
||||
// </div>}
|
||||
// {(canHaveFormula && showFormula) && (() => {
|
||||
// // TODO: Be able to show modal formulas too
|
||||
// const curr = (props.vps.verb.tenseCategory === "imperative" && props.vps.verb.negative)
|
||||
// ? imperativeTenseOptions.find(x => x.value === "imperfectiveImperative")
|
||||
// : [...verbTenseOptions, ...perfectTenseOptions, ...imperativeTenseOptions].find(o => o.value === props.vps.verb[
|
||||
// props.vps.verb.tenseCategory === "perfect"
|
||||
// ? "perfectTense"
|
||||
// : props.vps.verb.tenseCategory === "imperative"
|
||||
// ? "imperativeTense"
|
||||
// : "verbTense"
|
||||
// ]);
|
||||
// const formula = !curr
|
||||
// ? ""
|
||||
// : (props.vps.verb.tenseCategory === "modal")
|
||||
// ? composeFormula(curr.formula, "ability")
|
||||
// : (props.vps.verb.voice === "passive")
|
||||
// ? composeFormula(curr.formula, "passive")
|
||||
// : curr.formula;
|
||||
// if (curr && "formula" in curr) {
|
||||
// return <div className="mb-2" style={{ width: "250px", overflowY: "auto" }}>
|
||||
// <samp>{formula}</samp>
|
||||
// </div>
|
||||
// }
|
||||
// })()}
|
||||
// </div>
|
||||
// </div>;
|
||||
const [showFormula, setShowFormula] = useStickyState<boolean>(false, "showFormula");
|
||||
function onTenseSelect(o: { value: T.VerbTense | T.PerfectTense | T.ImperativeTense } | null) {
|
||||
if ("vpsComplete" in props) return;
|
||||
const tense = o?.value ? o.value : undefined;
|
||||
props.onChange({
|
||||
type: "set tense",
|
||||
payload: tense,
|
||||
});
|
||||
}
|
||||
function moveTense(dir: "forward" | "back") {
|
||||
if ("vpsComplete" in props) return;
|
||||
if (!props.vps.verb) return;
|
||||
return () => {
|
||||
// TODO: ABSTRACT THIS - SAFER
|
||||
const tenses = props.vps.verb.tenseCategory === "perfect"
|
||||
? perfectTenseOptions
|
||||
: props.vps.verb.tenseCategory === "imperative"
|
||||
? imperativeTenseOptions
|
||||
: verbTenseOptions;
|
||||
const currIndex = tenses.findIndex(tn => tn.value === props.vps.verb[
|
||||
// TODO: ABSTRACT THIS? - SAFER
|
||||
props.vps.verb.tenseCategory === "perfect"
|
||||
? "perfectTense"
|
||||
: props.vps.verb.tenseCategory === "imperative"
|
||||
? "imperativeTense"
|
||||
: "verbTense"
|
||||
]);
|
||||
if (currIndex === -1) {
|
||||
console.error("error moving tense", dir);
|
||||
return;
|
||||
}
|
||||
const newIndex = dir === "forward"
|
||||
? ((currIndex + 1) % tenses.length)
|
||||
: (currIndex === 0 ? (tenses.length - 1) : (currIndex - 1))
|
||||
const newTense = tenses[newIndex];
|
||||
onTenseSelect(newTense);
|
||||
};
|
||||
}
|
||||
function onPosNegSelect(payload: "true" | "false") {
|
||||
if ("vpsComplete" in props) return;
|
||||
props.onChange({
|
||||
type: "set negativity",
|
||||
payload,
|
||||
});
|
||||
}
|
||||
function onTenseCategorySelect(payload: "basic" | "modal" | "perfect" | "imperative") {
|
||||
if ("vpsComplete" in props) return;
|
||||
props.onChange({
|
||||
type: "set tense category",
|
||||
payload,
|
||||
});
|
||||
}
|
||||
const tOptions = ("vps" in props && (props.vps.verb?.tenseCategory === "perfect"))
|
||||
? perfectTenseOptions
|
||||
: ("vps" in props && (props.vps.verb?.tenseCategory === "imperative"))
|
||||
? imperativeTenseOptions
|
||||
: verbTenseOptions;
|
||||
const showImperativeOption = ("vps" in props && props.vps.verb.voice === "active")
|
||||
|| ("vpsComplete" in props && props.vpsComplete.verb.voice !== "active");
|
||||
const inPassiveVoice = ("vps" in props && props.vps.verb.voice === "passive") || ("vpsComplete" in props && props.vpsComplete.verb.voice === "passive");;
|
||||
const canHaveFormula = "vps" in props && props.mode !== "quiz";
|
||||
return <div>
|
||||
<div style={{ maxWidth: "300px", minWidth: "250px", margin: "0 auto" }}>
|
||||
<div className="d-flex flex-row justify-content-between align-items-center">
|
||||
<div className="h5">Verb Tense:</div>
|
||||
{canHaveFormula && <div className="clickable mb-2 small" onClick={() => setShowFormula(x => !x)}>
|
||||
🧪 {!showFormula ? "Show" : "Hide"} Formula
|
||||
</div>}
|
||||
</div>
|
||||
{("vpsComplete" in props || props.vps.verb) && <div className="mb-2">
|
||||
<ButtonSelect
|
||||
small
|
||||
value={"vpsComplete" in props
|
||||
? getTenseCategory(props.vpsComplete.verb.tense)
|
||||
: props.vps.verb.tenseCategory}
|
||||
// @ts-ignore
|
||||
options={showImperativeOption ? [{
|
||||
label: "Basic",
|
||||
value: "basic",
|
||||
}, {
|
||||
label: "Perfect",
|
||||
value: "perfect",
|
||||
}, {
|
||||
label: "Ability",
|
||||
value: "modal",
|
||||
}, {
|
||||
label: "Imperative",
|
||||
value: "imperative",
|
||||
}] : [{
|
||||
label: "Basic",
|
||||
value: "basic",
|
||||
}, {
|
||||
label: "Perfect",
|
||||
value: "perfect",
|
||||
}, {
|
||||
label: "Ability",
|
||||
value: "modal",
|
||||
}].filter(x => !(inPassiveVoice && x.value === "modal"))}
|
||||
handleChange={props.mode !== "quiz" ? onTenseCategorySelect : () => null}
|
||||
/>
|
||||
</div>}
|
||||
{"vpsComplete" in props
|
||||
? <div style={{ fontSize: "larger" }} className="mb-3">
|
||||
{[...verbTenseOptions, ...perfectTenseOptions, ...imperativeTenseOptions].find(o => o.value === props.vpsComplete.verb.tense)?.label}
|
||||
</div>
|
||||
: <>
|
||||
<Select
|
||||
isSearchable={false}
|
||||
// for some reason can't use tOptions with find here;
|
||||
value={props.vps.verb && ([...verbTenseOptions, ...perfectTenseOptions, ...imperativeTenseOptions].find(o => o.value === props.vps.verb[
|
||||
props.vps.verb.tenseCategory === "perfect"
|
||||
? "perfectTense"
|
||||
: props.vps.verb.tenseCategory === "imperative"
|
||||
? "imperativeTense"
|
||||
: "verbTense"
|
||||
]))}
|
||||
// @ts-ignore - gets messed up when using customStyles
|
||||
onChange={onTenseSelect}
|
||||
className="mb-2"
|
||||
options={tOptions}
|
||||
styles={customStyles}
|
||||
/>
|
||||
</>}
|
||||
{"vps" in props && props.vps.verb && (props.mode !== "quiz") && <div className="d-flex flex-row justify-content-between align-items-center mt-2 mb-1" style={{ width: "100%" }}>
|
||||
<div className="btn btn-light clickable" onClick={moveTense("back")}>
|
||||
<i className="fas fa-chevron-left" />
|
||||
</div>
|
||||
{props.mode === "phrases" && <ButtonSelect
|
||||
small
|
||||
value={props.vps.verb.negative.toString() as "true" | "false"}
|
||||
options={[{
|
||||
label: "Pos.",
|
||||
value: "false",
|
||||
}, {
|
||||
label: "Neg.",
|
||||
value: "true",
|
||||
}]}
|
||||
handleChange={onPosNegSelect}
|
||||
/>}
|
||||
<div onClick={moveTense("forward")} className="btn btn-light clickable">
|
||||
<i className="fas fa-chevron-right" />
|
||||
</div>
|
||||
</div>}
|
||||
{(canHaveFormula && showFormula) && (() => {
|
||||
// TODO: Be able to show modal formulas too
|
||||
const curr = (props.vps.verb.tenseCategory === "imperative" && props.vps.verb.negative)
|
||||
? imperativeTenseOptions.find(x => x.value === "imperfectiveImperative")
|
||||
: [...verbTenseOptions, ...perfectTenseOptions, ...imperativeTenseOptions].find(o => o.value === props.vps.verb[
|
||||
props.vps.verb.tenseCategory === "perfect"
|
||||
? "perfectTense"
|
||||
: props.vps.verb.tenseCategory === "imperative"
|
||||
? "imperativeTense"
|
||||
: "verbTense"
|
||||
]);
|
||||
const formula = !curr
|
||||
? ""
|
||||
: (props.vps.verb.tenseCategory === "modal")
|
||||
? composeFormula(curr.formula, "ability")
|
||||
: (props.vps.verb.voice === "passive")
|
||||
? composeFormula(curr.formula, "passive")
|
||||
: curr.formula;
|
||||
if (curr && "formula" in curr) {
|
||||
return <div className="mb-2" style={{ width: "250px", overflowY: "auto" }}>
|
||||
<samp>{formula}</samp>
|
||||
</div>
|
||||
}
|
||||
})()}
|
||||
</div>
|
||||
</div>;
|
||||
}
|
||||
|
||||
export default TensePicker;
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@lingdocs/inflect",
|
||||
"version": "5.0.11",
|
||||
"version": "5.0.12",
|
||||
"description": "Pashto inflector library",
|
||||
"main": "dist/index.js",
|
||||
"types": "dist/lib/library.d.ts",
|
||||
|
|
Loading…
Reference in New Issue