w gender colors

package.json

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

src/components/ButtonSelect.tsx

@@ -9,7 +9,7 @@
 import classNames from "classnames";
 
 type PickerProps = {
-    options: { label: any, value: string }[],
+    options: { label: any, value: string, color?: string }[],
     value: string,
     handleChange: (payload: string) => void,
     small?: boolean,
@@ -33,6 +33,8 @@ function ButtonSelect(props: PickerProps) {
                         onClick={() => props.handleChange(option.value)}
                         style={props.xSmall ? {
                             fontSize: "small",
+                            ...option.color ? 
+                                { background: option.color } : {},
                         } : {}}
                     >
                         {option.label}

src/components/VerbTable.tsx

@@ -14,7 +14,7 @@ import {
 } from "../lib/p-text-helpers";
 import { isSentenceForm } from "../lib/misc-helpers";
 import * as T from "../types";
-
+import genderColors from "../lib/gender-colors";
 
 const genderAbbrev = (gender: "masc" | "fem" | undefined): " m." | " f." | "" => (
     gender === "masc"
@@ -87,10 +87,7 @@ function VerbTable({ block, textOptions, english }: {
                     const rowLabel = `${pers[i]}${genderAbbrev(gender)}`;
                     const color = !gender
                         ? "inherit"
-                        : gender === "masc"
-                        ? "#78c8ed"
-                        : "#ff99aa";
-                    
+                        : genderColors[gender];
                     return (
                         <tr key={`${i}${gender}`}>
                             <th scope="row" style={{ color }}>{rowLabel}</th>

src/lib/gender-colors.ts

@@ -0,0 +1,6 @@
+const genderColors = {
+    masc: "#78c8ed",
+    fem: "#ff99aa",
+};
+
+export default genderColors;

src/library.ts

@@ -96,6 +96,7 @@ import {
 } from "./lib/accent-helpers";
 import defaultTextOptions from "./lib/default-text-options";
 import * as grammarUnits from "./lib/grammar-units";
+import genderColors from "./lib/gender-colors";
 import * as Types from "./types";
 
 export {
@@ -162,6 +163,7 @@ export {
     dictionaryEntryTextFields,
     dictionaryEntryNumberFields,
     dictionaryEntryBooleanFields,
+    genderColors,
     // TYPES
     Types,
 }