dce-reactkit 3.9.8 → 3.9.10

package/dist/cjs/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/esm/index.js

@@ -1666,24 +1666,28 @@ const RadioButton = (props) => {
     /* -------------------------------- Setup ------------------------------- */
     /*------------------------------------------------------------------------*/
     /* -------------- Props ------------- */
-    const { text, onSelected, ariaLabel, title, selected, id, noMarginOnRight, selectedVariant = (isDarkModeOn()
+    const { text, onSelected, ariaLabel, title, selected, id, className, noMarginOnRight, selectedVariant = (isDarkModeOn()
         ? Variant$1.Light
         : Variant$1.Secondary), unselectedVariant = (isDarkModeOn()
         ? Variant$1.Secondary
-        : Variant$1.Light), small, } = props;
+        : Variant$1.Light), small, useComplexFormatting, } = props;
     /*------------------------------------------------------------------------*/
     /* ------------------------------- Render ------------------------------- */
     /*------------------------------------------------------------------------*/
     /*----------------------------------------*/
     /* --------------- Main UI -------------- */
     /*----------------------------------------*/
-    return (React__default.createElement("button", { type: "button", id: id, title: title, className: `btn btn-${selected ? selectedVariant : unselectedVariant}${selected ? ' selected' : ''}${small ? ' btn-sm' : ''} m-0${noMarginOnRight ? '' : ' me-1'}`, "aria-label": `${ariaLabel}${selected ? ': currently selected' : ''}`, onClick: () => {
+    return (React__default.createElement("button", { type: "button", id: id, title: title, className: `btn btn-${selected ? selectedVariant : unselectedVariant}${selected ? ' selected' : ''}${small ? ' btn-sm' : ''} m-0${noMarginOnRight ? '' : ' me-1'} ${className !== null && className !== void 0 ? className : ''}`, "aria-label": `${ariaLabel}${selected ? ': currently selected' : ''}`, onClick: () => {
             if (!selected) {
                 onSelected();
             }
         } },
         React__default.createElement(FontAwesomeIcon, { icon: selected ? faDotCircle : faCircle$1, className: "me-1" }),
-        text));
+        useComplexFormatting
+            ? (React__default.createElement("pre", { className: "ps-2 text-start text-break", style: {
+                    whiteSpace: 'pre-wrap',
+                } }, text))
+            : (React__default.createElement("div", { className: "flex-grow-1 text-start text-break ps-2" }, text))));
 };
 
 /**
@@ -1911,7 +1915,13 @@ const SimpleDateChooser = (props) => {
         }
         const monthName = getMonthName(month).full;
         // Year is start year +1 for each 12 months
-        const year = (startYear + (Math.floor(unmoddedMonth / 12)));
+        let yearsToAdd = 0;
+        let monthsOfYearsToAdd = unmoddedMonth;
+        while (monthsOfYearsToAdd > 12) {
+            monthsOfYearsToAdd -= 12;
+            yearsToAdd += 1;
+        }
+        const year = startYear + yearsToAdd;
         // Figure out which days are allowed
         const days = [];
         const numDaysInMonth = (new Date(year, month, 0)).getDate();
@@ -1962,7 +1972,7 @@ const SimpleDateChooser = (props) => {
             });
         }
     });
-    return (React__default.createElement("div", { className: "SimpleDateChooser d-inline-block", "aria-label": `date chooser with selected date: ${month} ${day}, ${year}` },
+    return (React__default.createElement("div", { className: "SimpleDateChooser d-inline-block", "aria-label": `date chooser with selected date: ${month}/${day}/${year}` },
         React__default.createElement("select", { "aria-label": `month for ${ariaLabel}`, className: "custom-select d-inline-block mr-1", style: { width: 'auto' }, id: `SimpleDateChooser-${name}-month`, value: `${month}-${year}`, onChange: (e) => {
                 const choice = choices[e.target.selectedIndex];
                 // Change day, month, and year