dce-reactkit 3.9.9 → 3.10.0

package/dist/esm/types/components/RadioButton.d.ts

@@ -11,10 +11,12 @@ type Props = {
     title?: string;
     selected?: boolean;
     id?: string;
+    className?: string;
     noMarginOnRight?: boolean;
     selectedVariant?: Variant;
     unselectedVariant?: Variant;
     small?: boolean;
+    useComplexFormatting?: boolean;
 };
 declare const RadioButton: React.FC<Props>;
 export default RadioButton;

package/dist/index.d.ts

@@ -244,10 +244,12 @@ type Props$i = {
     title?: string;
     selected?: boolean;
     id?: string;
+    className?: string;
     noMarginOnRight?: boolean;
     selectedVariant?: Variant;
     unselectedVariant?: Variant;
     small?: boolean;
+    useComplexFormatting?: boolean;
 };
 declare const RadioButton: React$1.FC<Props$i>;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dce-reactkit",
-  "version": "3.9.9",
+  "version": "3.10.0",
   "description": "Shared components for Harvard DCE apps",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",

package/src/components/CheckboxButton.tsx

@@ -126,21 +126,21 @@ const CheckboxButton: React.FC<Props> = (props) => {
         </div>
         {
           useComplexFormatting
-          ? (
-            <pre
-              className="ps-2 text-start text-break"
-              style={{
-                whiteSpace: 'pre-wrap',
-              }}
-            >
-              {text}
-            </pre>
-          )
-          : (
-            <div className="flex-grow-1 text-start text-break ps-2">
-              {text}
-            </div>
-          )
+            ? (
+              <pre
+                className="ps-2 text-start text-break"
+                style={{
+                  whiteSpace: 'pre-wrap',
+                }}
+              >
+                {text}
+              </pre>
+            )
+            : (
+              <div className="flex-grow-1 text-start text-break ps-2">
+                {text}
+              </div>
+            )
         }
       </div>
     </button>

package/src/components/RadioButton.tsx

@@ -32,6 +32,8 @@ type Props = {
   selected?: boolean,
   // The id of the button
   id?: string,
+  // Custom class name of the button
+  className?: string,
   // If true, no margin on right
   noMarginOnRight?: boolean,
   // Variant for when radio is selected
@@ -40,6 +42,8 @@ type Props = {
   unselectedVariant?: Variant,
   // True if using a small button
   small?: boolean,
+  // If true, use complex formatting (tabs, newlines) in the text
+  useComplexFormatting?: boolean,
 };
 
 /*------------------------------------------------------------------------*/
@@ -60,6 +64,7 @@ const RadioButton: React.FC<Props> = (props) => {
     title,
     selected,
     id,
+    className,
     noMarginOnRight,
     selectedVariant = (
       isDarkModeOn()
@@ -72,6 +77,7 @@ const RadioButton: React.FC<Props> = (props) => {
         : Variant.Light
     ),
     small,
+    useComplexFormatting,
   } = props;
 
   /*------------------------------------------------------------------------*/
@@ -87,7 +93,7 @@ const RadioButton: React.FC<Props> = (props) => {
       type="button"
       id={id}
       title={title}
-      className={`btn btn-${selected ? selectedVariant : unselectedVariant}${selected ? ' selected' : ''}${small ? ' btn-sm' : ''} m-0${noMarginOnRight ? '' : ' me-1'}`}
+      className={`btn btn-${selected ? selectedVariant : unselectedVariant}${selected ? ' selected' : ''}${small ? ' btn-sm' : ''} m-0${noMarginOnRight ? '' : ' me-1'} ${className ?? ''}`}
       aria-label={`${ariaLabel}${selected ? ': currently selected' : ''}`}
       onClick={() => {
         if (!selected) {
@@ -99,7 +105,24 @@ const RadioButton: React.FC<Props> = (props) => {
         icon={selected ? faDotCircle : faCircle}
         className="me-1"
       />
-      {text}
+      {
+          useComplexFormatting
+            ? (
+              <pre
+                className="ps-2 text-start text-break"
+                style={{
+                  whiteSpace: 'pre-wrap',
+                }}
+              >
+                {text}
+              </pre>
+            )
+            : (
+              <div className="flex-grow-1 text-start text-break ps-2">
+                {text}
+              </div>
+            )
+        }
     </button>
   );
 };

package/src/helpers/genRouteHandler.ts

@@ -625,16 +625,16 @@ const genRouteHandler = (
 
         // Main log info
         const mainLogInfo: LogMainInfo = {
-          id: `${launchInfo ? 'unknown' : launchInfo.userId}-${Date.now()}-${Math.floor(Math.random() * 100000)}-${Math.floor(Math.random() * 100000)}`,
-          userFirstName: (launchInfo ? 'unknown' : launchInfo.userFirstName),
-          userLastName: (launchInfo ? 'unknown' : launchInfo.userLastName),
-          userEmail: (launchInfo ? 'unknown' : launchInfo.userEmail),
-          userId: (launchInfo ? 'unknown' : launchInfo.userId),
+          id: `${launchInfo ? launchInfo.userId : 'unknown'}-${Date.now()}-${Math.floor(Math.random() * 100000)}-${Math.floor(Math.random() * 100000)}`,
+          userFirstName: (launchInfo ? launchInfo.userFirstName: 'unknown'),
+          userLastName: (launchInfo ? launchInfo.userLastName : 'unknown'),
+          userEmail: (launchInfo ? launchInfo.userEmail : 'unknown'),
+          userId: (launchInfo ? launchInfo.userId : 'unknown'),
           isLearner: (launchInfo && !!launchInfo.isLearner),
           isAdmin: (launchInfo && !!launchInfo.isAdmin),
           isTTM: (launchInfo && !!launchInfo.isTTM),
-          courseId: (launchInfo ? 'unknown' : launchInfo.courseId),
-          courseName: (launchInfo ? 'unknown' : launchInfo.contextLabel),
+          courseId: (launchInfo ? launchInfo.courseId : 'unknown' ),
+          courseName: (launchInfo ? launchInfo.contextLabel : 'unknown'),
           browser,
           device,
           year,