ability to show demonstratives without nouns

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "pashto-inflector",
-  "version": "7.3.1",
+  "version": "7.3.2",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "pashto-inflector",
-      "version": "7.3.1",
+      "version": "7.3.2",
       "hasInstallScript": true,
       "license": "MIT",
       "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "pashto-inflector",
-  "version": "7.3.1",
+  "version": "7.3.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",

src/components/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@lingdocs/ps-react",
-  "version": "7.3.1",
+  "version": "7.3.2",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@lingdocs/ps-react",
-      "version": "7.3.1",
+      "version": "7.3.2",
       "license": "MIT",
       "dependencies": {
         "@formkit/auto-animate": "^1.0.0-beta.3",

src/components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lingdocs/ps-react",
-  "version": "7.3.1",
+  "version": "7.3.2",
   "description": "Pashto inflector library module with React components",
   "main": "dist/components/library.js",
   "module": "dist/components/library.js",

src/components/src/blocks/Block.tsx

@@ -663,6 +663,8 @@ export function NPBlock({
     np.selection.possesor &&
     !np.selection.possesor.shrunken
   );
+  const demWithoutNoun =
+    np.selection.demonstrative && !np.selection.demonstrative.withNoun;
   const elements = [
     ...(!inside
       ? [
@@ -676,10 +678,21 @@ export function NPBlock({
     <Demonstrative opts={opts} script={script}>
       {np.selection.demonstrative ? np.selection.demonstrative : undefined}
     </Demonstrative>,
-    <Adjectives opts={opts} script={script}>
+    <div
-      {np.selection.adjectives}
+      style={{
-    </Adjectives>,
+        opacity: demWithoutNoun ? 0.5 : 1,
-    <div className={np.selection.adjectives?.length ? "mx-1" : ""}>
+      }}
+    >
+      <Adjectives opts={opts} script={script}>
+        {np.selection.adjectives}
+      </Adjectives>
+    </div>,
+    <div
+      style={{
+        opacity: demWithoutNoun ? 0.5 : 1,
+      }}
+      className={np.selection.adjectives?.length ? "mx-1" : ""}
+    >
       {" "}
       {flattenLengths(np.selection.ps)[0][script]}
     </div>,

src/components/src/np-picker/DemonstrativePicker.tsx

@@ -13,7 +13,7 @@ export default function DemonstrativePicker({
       onChange({
         type: "demonstrative",
         demonstrative: d,
-        hideNoun: false,
+        withNoun: true,
       });
     } else {
       onChange({
@@ -22,37 +22,65 @@ export default function DemonstrativePicker({
       });
     }
   }
+  function handleWithNounChange(e: React.ChangeEvent<HTMLInputElement>) {
+    if (demonstrative) {
+      onChange({
+        ...demonstrative,
+        withNoun: e.target.checked,
+      });
+    }
+  }
   return (
-    <div className="d-flex flex-row justify-content-around py-1">
+    <div>
-      <div>
+      <div className="d-flex flex-row justify-content-around py-1">
-        <button
+        <div>
-          className={classNames("btn", "btn-outline-secondary", {
+          <button
-            active: demonstrative?.demonstrative === "daa",
+            className={classNames("btn", "btn-outline-secondary", {
-          })}
+              active: demonstrative?.demonstrative === "daa",
-          onClick={() => handleDChange("daa")}
+            })}
-        >
+            onClick={() => handleDChange("daa")}
-          دا
+          >
-        </button>
+            دا
+          </button>
+        </div>
+        <div>
+          <button
+            className={classNames("btn", "btn-outline-secondary", {
+              active: demonstrative?.demonstrative === "dagha",
+            })}
+            onClick={() => handleDChange("dagha")}
+          >
+            دغه
+          </button>
+        </div>
+        <div>
+          <button
+            className={classNames("btn", "btn-outline-secondary", {
+              active: demonstrative?.demonstrative === "hagha",
+            })}
+            onClick={() => handleDChange("hagha")}
+          >
+            هغه
+          </button>
+        </div>
       </div>
-      <div>
+      <div
-        <button
+        className="form-check"
-          className={classNames("btn", "btn-outline-secondary", {
+        style={{
-            active: demonstrative?.demonstrative === "dagha",
+          opacity: demonstrative ? 1 : 0.5,
-          })}
+        }}
-          onClick={() => handleDChange("dagha")}
+      >
-        >
+        <input
-          دغه
+          className="form-check-input"
-        </button>
+          type="checkbox"
-      </div>
+          checked={demonstrative?.withNoun}
-      <div>
+          onChange={handleWithNounChange}
-        <button
+          id="withNoun"
-          className={classNames("btn", "btn-outline-secondary", {
+          disabled={!demonstrative}
-            active: demonstrative?.demonstrative === "hagha",
+        />
-          })}
+        <label className="form-check-label text-muted" htmlFor="withNoun">
-          onClick={() => handleDChange("hagha")}
+          with noun
-        >
+        </label>
-          هغه
-        </button>
       </div>
     </div>
   );

src/components/src/np-picker/NPNounPicker.tsx

@@ -99,7 +99,12 @@ function NPNounPicker(props: {
     }
   }
   return (
-    <div style={{ maxWidth: "225px", minWidth: "125px" }}>
+    <div
+      style={{
+        maxWidth: "225px",
+        minWidth: "125px",
+      }}
+    >
       {!addingDemonstrative && !props.noun?.demonstrative ? (
         <div>
           <span
@@ -143,98 +148,107 @@ function NPNounPicker(props: {
                 handleChange={setPatternFilter}
             />
         </div>} */}
-      {props.noun && (
+      <div
-        <AdjectiveManager
+        style={{
-          phraseIsComplete={props.phraseIsComplete}
+          opacity:
-          adjectives={props.noun?.adjectives}
+            props.noun?.demonstrative && !props.noun.demonstrative.withNoun
-          entryFeeder={props.entryFeeder}
+              ? 0.5
-          opts={props.opts}
+              : 1,
-          onChange={handelAdjectivesUpdate}
+        }}
-        />
+      >
-      )}
+        {props.noun && (
-      <div className="h6">Noun</div>
+          <AdjectiveManager
-      {!(
+            phraseIsComplete={props.phraseIsComplete}
-        props.noun &&
+            adjectives={props.noun?.adjectives}
-        (props.noun.dynamicComplement || props.noun.genStativeComplement)
+            entryFeeder={props.entryFeeder}
-      ) ? (
-        <div>
-          <EntrySelect
-            value={props.noun?.entry}
-            entryFeeder={props.entryFeeder.nouns}
-            onChange={onEntrySelect}
-            name="Noun"
             opts={props.opts}
+            onChange={handelAdjectivesUpdate}
           />
-        </div>
+        )}
-      ) : (
+        <div className="h6">Noun</div>
-        <div>
+        {!(
-          {props.noun && (
+          props.noun &&
+          (props.noun.dynamicComplement || props.noun.genStativeComplement)
+        ) ? (
+          <div>
+            <EntrySelect
+              value={props.noun?.entry}
+              entryFeeder={props.entryFeeder.nouns}
+              onChange={onEntrySelect}
+              name="Noun"
+              opts={props.opts}
+            />
+          </div>
+        ) : (
+          <div>
+            {props.noun && (
+              <div>
+                <div className="mb-2">
+                  Included in{" "}
+                  {props.noun.genStativeComplement ? "Gen. Stat." : "Dyn."}{" "}
+                  Compound:
+                </div>
+                <div className="mb-3 text-center">
+                  <InlinePs opts={props.opts}>
+                    {{ p: props.noun.entry.p, f: props.noun.entry.f }}
+                  </InlinePs>
+                  <div className="text-muted">{props.noun.entry.e}</div>
+                </div>
+              </div>
+            )}
+          </div>
+        )}
+        {props.noun && (
+          <div className="my-2 d-flex flex-row justify-content-around align-items-center">
             <div>
-              <div className="mb-2">
+              {props.noun.genderCanChange ? (
-                Included in{" "}
+                <ButtonSelect
-                {props.noun.genStativeComplement ? "Gen. Stat." : "Dyn."}{" "}
+                  small
-                Compound:
+                  options={[
-              </div>
+                    { label: "Masc", value: "masc" },
-              <div className="mb-3 text-center">
+                    { label: "Fem", value: "fem" },
-                <InlinePs opts={props.opts}>
+                  ]}
-                  {{ p: props.noun.entry.p, f: props.noun.entry.f }}
+                  value={props.noun.gender}
-                </InlinePs>
+                  handleChange={(gender) => {
-                <div className="text-muted">{props.noun.entry.e}</div>
+                    if (!props.noun || !props.noun.genderCanChange) return;
-              </div>
+                    props.onChange({
+                      ...props.noun,
+                      gender,
+                    });
+                  }}
+                />
+              ) : props.noun.gender === "masc" ? (
+                "Masc."
+              ) : (
+                "Fem."
+              )}
+            </div>
+            <div>
+              {props.noun.numberCanChange ? (
+                <ButtonSelect
+                  small
+                  options={[
+                    { label: "Sing.", value: "singular" },
+                    { label: "Plur.", value: "plural" },
+                  ]}
+                  value={props.noun.number}
+                  handleChange={(number) => {
+                    if (!props.noun || !props.noun.numberCanChange) return;
+                    props.onChange({
+                      ...props.noun,
+                      number,
+                    });
+                  }}
+                />
+              ) : props.noun.number === "singular" ? (
+                "Sing."
+              ) : (
+                "Plur."
+              )}
             </div>
-          )}
-        </div>
-      )}
-      {props.noun && (
-        <div className="my-2 d-flex flex-row justify-content-around align-items-center">
-          <div>
-            {props.noun.genderCanChange ? (
-              <ButtonSelect
-                small
-                options={[
-                  { label: "Masc", value: "masc" },
-                  { label: "Fem", value: "fem" },
-                ]}
-                value={props.noun.gender}
-                handleChange={(gender) => {
-                  if (!props.noun || !props.noun.genderCanChange) return;
-                  props.onChange({
-                    ...props.noun,
-                    gender,
-                  });
-                }}
-              />
-            ) : props.noun.gender === "masc" ? (
-              "Masc."
-            ) : (
-              "Fem."
-            )}
           </div>
-          <div>
+        )}
-            {props.noun.numberCanChange ? (
+      </div>
-              <ButtonSelect
-                small
-                options={[
-                  { label: "Sing.", value: "singular" },
-                  { label: "Plur.", value: "plural" },
-                ]}
-                value={props.noun.number}
-                handleChange={(number) => {
-                  if (!props.noun || !props.noun.numberCanChange) return;
-                  props.onChange({
-                    ...props.noun,
-                    number,
-                  });
-                }}
-              />
-            ) : props.noun.number === "singular" ? (
-              "Sing."
-            ) : (
-              "Plur."
-            )}
-          </div>
-        </div>
-      )}
     </div>
   );
 }

src/lib/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lingdocs/inflect",
-  "version": "7.3.1",
+  "version": "7.3.2",
   "description": "Pashto inflector library",
   "main": "dist/index.js",
   "types": "dist/lib/library.d.ts",

src/lib/src/phrase-building/np-tools.ts

@@ -12,16 +12,22 @@ function getBaseAndAdjectives({
     return getSandwichPsBaseAndAdjectives(selection);
   }
   const adjs = "adjectives" in selection && selection.adjectives;
-  const demons = ("demonstrative" in selection &&
+  const demonstrativePs = ("demonstrative" in selection &&
     selection.demonstrative?.ps) || { p: "", f: "" };
   if (!adjs) {
     // TODO: does this ever get used??
-    return flattenLengths(selection.ps).map((x) => concatPsString(demons, x));
+    return flattenLengths(selection.ps).map((x) =>
+      concatPsString(demonstrativePs, x)
+    );
+  }
+
+  if (selection.demonstrative && !selection.demonstrative.withNoun) {
+    return [demonstrativePs];
   }
 
   return flattenLengths(selection.ps).map((p) =>
     concatPsString(
-      demons,
+      demonstrativePs,
       // demons ? " " : "",
       adjs.reduce(
         (accum, curr) => {
@@ -207,9 +213,10 @@ function addArticlesAndAdjs(
         : " (m.)"
       : "";
     const demonstrative = np.demonstrative ? ` ${np.demonstrative.e}` : "";
-    return `${
+    const demWithoutNoun = np.demonstrative && !np.demonstrative.withNoun;
-      np.demonstrative ? "" : articles
+    return `${np.demonstrative ? "" : articles}${demonstrative}${
-    }${demonstrative}${adjs}${word}${genderTag}`;
+      demWithoutNoun ? ` (${(adjs + word).trim()})` : adjs + word
+    }${genderTag}`;
   } catch (e) {
     return undefined;
   }

src/types.ts

@@ -905,7 +905,7 @@ export type NounSelection = {
 export type DemonstrativeSelection = {
   type: "demonstrative";
   demonstrative: "daa" | "hagha" | "dagha";
-  hideNoun: boolean;
+  withNoun: boolean;
 };
 
 export type AdverbSelection = {
@@ -1024,7 +1024,7 @@ export type Rendered<
   ? {
       type: "demonstrative";
       demonstrative: DemonstrativeSelection["demonstrative"];
-      hideNoun: boolean;
+      withNoun: boolean;
       ps: PsString;
       e: string;
     }