funda-ui 3.8.815 → 3.8.821

package/lib/cjs/Table/index.js

@@ -334,18 +334,20 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
             setVal = _useState2[1]; // Avoid the error "react checkbox changing an uncontrolled input to be controlled"
 
           function handleFocus(event) {
-            rootRef.current.classList.add('focus');
+            var _rootRef$current;
+            (_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 ? void 0 : _rootRef$current.classList.add('focus');
 
             //
             onFocus === null || onFocus === void 0 ? void 0 : onFocus(event);
           }
           function handleChange(event) {
+            var _rootRef$current2;
             var _val = event.target.checked;
             setVal(_val);
 
             //----
             //remove focus style
-            rootRef.current.classList.remove('focus');
+            (_rootRef$current2 = rootRef.current) === null || _rootRef$current2 === void 0 ? void 0 : _rootRef$current2.classList.remove('focus');
 
             //
             if (typeof onChange === 'function') {
@@ -353,9 +355,10 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
             }
           }
           function handleBlur(event) {
+            var _rootRef$current3;
             //----
             //remove focus style
-            rootRef.current.classList.remove('focus');
+            (_rootRef$current3 = rootRef.current) === null || _rootRef$current3 === void 0 ? void 0 : _rootRef$current3.classList.remove('focus');
 
             //
             onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
@@ -1818,7 +1821,8 @@ var Table = function Table(props) {
     });
   };
   function handleTbodyLeave(e) {
-    tbodyRef.current.classList.remove('drag-trigger-mousedown');
+    var _tbodyRef$current;
+    (_tbodyRef$current = tbodyRef.current) === null || _tbodyRef$current === void 0 ? void 0 : _tbodyRef$current.classList.remove('drag-trigger-mousedown');
   }
 
   // events fired on the drop targets
@@ -1852,10 +1856,11 @@ var Table = function Table(props) {
     onDrag === null || onDrag === void 0 ? void 0 : onDrag(dragStart, null);
   }, [handledragOver]);
   var handleDragEnd = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useCallback)(function (e) {
+    var _tbodyRef$current2;
     draggedObj.style.display = 'table-row';
     removePlaceholder();
     draggedObj.classList.remove('dragging');
-    tbodyRef.current.classList.remove('drag-trigger-mousedown');
+    (_tbodyRef$current2 = tbodyRef.current) === null || _tbodyRef$current2 === void 0 ? void 0 : _tbodyRef$current2.classList.remove('drag-trigger-mousedown');
     if (overObj === null) return;
 
     // update state

package/lib/cjs/TagInput/index.js

@@ -370,7 +370,8 @@ var TagInput = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(fu
     //----
     //remove focus style
     if (val === '') {
-      rootRef.current.classList.remove('focus');
+      var _rootRef$current;
+      (_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 ? void 0 : _rootRef$current.classList.remove('focus');
     }
 
     //
@@ -389,7 +390,8 @@ var TagInput = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(fu
     setUserInput(val);
   }
   function handleFocus(event) {
-    rootRef.current.classList.add('focus');
+    var _rootRef$current2;
+    (_rootRef$current2 = rootRef.current) === null || _rootRef$current2 === void 0 ? void 0 : _rootRef$current2.classList.add('focus');
 
     //
     onFocus === null || onFocus === void 0 ? void 0 : onFocus(event);
@@ -401,7 +403,8 @@ var TagInput = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(fu
     //----
     //remove focus style
     if (val === '') {
-      rootRef.current.classList.remove('focus');
+      var _rootRef$current3;
+      (_rootRef$current3 = rootRef.current) === null || _rootRef$current3 === void 0 ? void 0 : _rootRef$current3.classList.remove('focus');
     }
 
     //

package/lib/cjs/Textarea/index.js

@@ -250,8 +250,9 @@ var Textarea = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_reac
   // auto size
   utils_useAutosizeTextArea(autoSize ? valRef.current : null, autoSize ? changedVal : '');
   function handleFocus(event) {
+    var _rootRef$current;
     var el = event.target;
-    rootRef.current.classList.add('focus');
+    (_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 ? void 0 : _rootRef$current.classList.add('focus');
 
     //
     onFocus === null || onFocus === void 0 ? void 0 : onFocus(event, valRef.current);
@@ -263,7 +264,8 @@ var Textarea = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_reac
     //----
     //remove focus style
     if (val === '') {
-      rootRef.current.classList.remove('focus');
+      var _rootRef$current2;
+      (_rootRef$current2 = rootRef.current) === null || _rootRef$current2 === void 0 ? void 0 : _rootRef$current2.classList.remove('focus');
     }
 
     //
@@ -283,7 +285,8 @@ var Textarea = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_reac
     //----
     //remove focus style
     if (val === '') {
-      rootRef.current.classList.remove('focus');
+      var _rootRef$current3;
+      (_rootRef$current3 = rootRef.current) === null || _rootRef$current3 === void 0 ? void 0 : _rootRef$current3.classList.remove('focus');
     }
 
     //

package/lib/cjs/Tree/index.js

@@ -334,18 +334,20 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
             setVal = _useState2[1]; // Avoid the error "react checkbox changing an uncontrolled input to be controlled"
 
           function handleFocus(event) {
-            rootRef.current.classList.add('focus');
+            var _rootRef$current;
+            (_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 ? void 0 : _rootRef$current.classList.add('focus');
 
             //
             onFocus === null || onFocus === void 0 ? void 0 : onFocus(event);
           }
           function handleChange(event) {
+            var _rootRef$current2;
             var _val = event.target.checked;
             setVal(_val);
 
             //----
             //remove focus style
-            rootRef.current.classList.remove('focus');
+            (_rootRef$current2 = rootRef.current) === null || _rootRef$current2 === void 0 ? void 0 : _rootRef$current2.classList.remove('focus');
 
             //
             if (typeof onChange === 'function') {
@@ -353,9 +355,10 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
             }
           }
           function handleBlur(event) {
+            var _rootRef$current3;
             //----
             //remove focus style
-            rootRef.current.classList.remove('focus');
+            (_rootRef$current3 = rootRef.current) === null || _rootRef$current3 === void 0 ? void 0 : _rootRef$current3.classList.remove('focus');
 
             //
             onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);

package/lib/esm/CascadingSelect/index.tsx

@@ -436,7 +436,7 @@ const CascadingSelect = (props: CascadingSelectProps) => {
 
 
     function handleFocus(event: any) {
-        rootRef.current.classList.add('focus');
+        rootRef.current?.classList.add('focus');
 
         //
         handleDisplayOptions(null);
@@ -450,7 +450,7 @@ const CascadingSelect = (props: CascadingSelectProps) => {
 
         //----
         //remove focus style
-        rootRef.current.classList.remove('focus');
+        rootRef.current?.classList.remove('focus');
 
 
         //

package/lib/esm/CascadingSelectE2E/index.tsx

@@ -564,7 +564,7 @@ const CascadingSelectE2E = (props: CascadingSelectE2EProps) => {
 
 
     function handleFocus(event: any) {
-        rootRef.current.classList.add('focus');
+        rootRef.current?.classList.add('focus');
 
         //
         handleDisplayOptions(null);
@@ -578,7 +578,7 @@ const CascadingSelectE2E = (props: CascadingSelectE2EProps) => {
 
         //----
         //remove focus style
-        rootRef.current.classList.remove('focus');
+        rootRef.current?.classList.remove('focus');
 
 
         //

package/lib/esm/Checkbox/index.tsx

@@ -59,7 +59,7 @@ const Checkbox = forwardRef((props: CheckboxProps, ref: any) => {
     const [val, setVal] = useState<any>(null || false);  // Avoid the error "react checkbox changing an uncontrolled input to be controlled"
 
     function handleFocus(event: any) {
-        rootRef.current.classList.add('focus');
+        rootRef.current?.classList.add('focus');
 
         //
         onFocus?.(event);
@@ -73,7 +73,7 @@ const Checkbox = forwardRef((props: CheckboxProps, ref: any) => {
 
         //----
         //remove focus style
-        rootRef.current.classList.remove('focus');
+        rootRef.current?.classList.remove('focus');
 
         //
         if (typeof (onChange) === 'function') {
@@ -89,7 +89,7 @@ const Checkbox = forwardRef((props: CheckboxProps, ref: any) => {
 
         //----
         //remove focus style
-        rootRef.current.classList.remove('focus');
+        rootRef.current?.classList.remove('focus');
 
         //
         onBlur?.(event);

package/lib/esm/ColorPicker/index.tsx

@@ -76,7 +76,7 @@ const ColorPicker = forwardRef((props: ColorPickerProps, ref: any) => {
 
 
     function handleFocus(event: ChangeEvent<HTMLInputElement>) {
-        rootRef.current.classList.add('focus');
+        rootRef.current?.classList.add('focus');
 
         //
         onFocus?.(event);
@@ -91,7 +91,7 @@ const ColorPicker = forwardRef((props: ColorPickerProps, ref: any) => {
         //----
         //remove focus style
         if (val === '') {
-            rootRef.current.classList.remove('focus');
+            rootRef.current?.classList.remove('focus');
         }
 
         //
@@ -107,7 +107,7 @@ const ColorPicker = forwardRef((props: ColorPickerProps, ref: any) => {
         //----
         //remove focus style
         if (val === '') {
-            rootRef.current.classList.remove('focus');
+            rootRef.current?.classList.remove('focus');
         }
 
         //

package/lib/esm/Date/index.tsx

@@ -466,7 +466,7 @@ const Date = forwardRef((props: DateProps, ref: any) => {
             popwinPosHide();
 
             //remove focus style
-            rootRef.current.classList.remove('focus');
+            rootRef.current?.classList.remove('focus');
         }
 
     }
@@ -486,7 +486,7 @@ const Date = forwardRef((props: DateProps, ref: any) => {
 
 
     function handleFocus(event: ChangeEvent<HTMLElement>) {
-        rootRef.current.classList.add('focus');
+        rootRef.current?.classList.add('focus');
 
 
         //
@@ -505,7 +505,7 @@ const Date = forwardRef((props: DateProps, ref: any) => {
     function handleBlur(event: ChangeEvent<HTMLElement>) {
 
         //remove focus style
-        rootRef.current.classList.remove('focus');
+        rootRef.current?.classList.remove('focus');
 
         //
         onBlur?.(inputRef.current);

package/lib/esm/DynamicFields/index.tsx

@@ -130,9 +130,9 @@ const DynamicFields = (props: DynamicFieldsProps) => {
         if (innerAppendEmptyContent === '' || typeof innerAppendEmptyContent === 'undefined') return false;
 
         if (type === 'add') {
-            emptyRef.current.classList.add(ITEM_HIDE_CLASSNAME);
+            emptyRef.current?.classList.add(ITEM_HIDE_CLASSNAME);
         } else {
-            emptyRef.current.classList.remove(ITEM_HIDE_CLASSNAME);
+            emptyRef.current?.classList.remove(ITEM_HIDE_CLASSNAME);
         }
         return true;
     }

package/lib/esm/File/index.tsx

@@ -214,7 +214,7 @@ const File = forwardRef((props: FileProps, ref: any) => {
         //----
         //remove focus style
         if (val === '') {
-            rootRef.current.classList.remove('focus');
+            rootRef.current?.classList.remove('focus');
         }
 
         //

package/lib/esm/Input/index.tsx

@@ -135,7 +135,7 @@ const Input = forwardRef((props: InputProps, ref: any) => {
 
 
     function handleFocus(event: ChangeEvent<HTMLInputElement>) {
-        rootRef.current.classList.add('focus');
+        rootRef.current?.classList.add('focus');
 
         //
         onFocus?.(event, onComposition, valRef.current);    
@@ -150,7 +150,7 @@ const Input = forwardRef((props: InputProps, ref: any) => {
         //----
         //remove focus style
         if (val === '') {
-            rootRef.current.classList.remove('focus');
+            rootRef.current?.classList.remove('focus');
         }
 
         //
@@ -173,7 +173,7 @@ const Input = forwardRef((props: InputProps, ref: any) => {
         //----
         //remove focus style
         if (val === '') {
-            rootRef.current.classList.remove('focus');
+            rootRef.current?.classList.remove('focus');
         }
 
         //

package/lib/esm/MultiFuncSelect/index.tsx

@@ -1162,7 +1162,7 @@ const MultiFuncSelect = forwardRef((props: MultiFuncSelectProps, ref: any) => {
         [].slice.call(document.querySelectorAll('.mf-select__wrapper')).forEach((node: any) => {
             node.classList.remove('active', 'focus');
         });
-        rootRef.current.classList.add('active', 'focus');
+        rootRef.current?.classList.add('active', 'focus');
     }
 
    
@@ -1187,7 +1187,7 @@ const MultiFuncSelect = forwardRef((props: MultiFuncSelectProps, ref: any) => {
 
         //remove focus style
         if (!(MULTI_SEL_VALID)) {
-            rootRef.current.classList.remove('focus');
+            rootRef.current?.classList.remove('focus');
         }
 
         // get options
@@ -1671,7 +1671,7 @@ const MultiFuncSelect = forwardRef((props: MultiFuncSelectProps, ref: any) => {
     //
     function handleFocus(event: any) {
 
-        rootRef.current.classList.add('focus');
+        rootRef.current?.classList.add('focus');
 
         // update temporary value
         setControlTempValue('');

package/lib/esm/Radio/index.tsx

@@ -90,13 +90,50 @@ const Radio = (props: RadioProps) => {
     const [hasErr, setHasErr] = useState<boolean>(false);
     const [controlValue, setControlValue] = useState<string | undefined>('');
 
+    function stringlineToHump(str: any) {
+        if (typeof str === 'string' && str.length > 0) {
+            const re = /-(\w)/g;
+            str = str.replace(re, function ($0, $1) {
+                return $1.toUpperCase();
+            });
+            return str;
+        } else {
+            return str;
+        }
+
+    }
 
 
+    function getDataAttributes(node: any) {
+        if (node === null) return [];
+
+        const res: any  = {};
+        for (const attr of node.attributes) {
+            if (/^data-/.test(attr.name)) {
+                res[stringlineToHump(attr.name)] = attr.value;
+            }
+        }
+
+        return res;
+
+    }
+ 
+
     async function fetchData(params: any) {
 
         // set default value
         if (typeof value !== 'undefined' && value !== '') rootRef.current.dataset.value = value;
 
+
+        if (rootRef.current) {
+            const allControlsData: any[] = [];
+            [].slice.call(rootRef.current.querySelectorAll(`[type="radio"]`)).forEach((el: HTMLInputElement, i: number) => {
+                allControlsData.push(getDataAttributes(el));
+            });
+            rootRef.current.setAttribute('data-controls-cus-attrs', JSON.stringify(allControlsData));
+        }
+        
+        
         //
         if (typeof fetchFuncAsync === 'object') {
 
@@ -223,7 +260,7 @@ const Radio = (props: RadioProps) => {
 
     //
     function handleFocus(event: any) {
-        rootRef.current.classList.add('focus');
+        rootRef.current?.classList.add('focus');
 
         //
         onFocus?.(event);
@@ -254,7 +291,7 @@ const Radio = (props: RadioProps) => {
 
         //----
         //remove focus style
-        rootRef.current.classList.remove('focus');
+        rootRef.current?.classList.remove('focus');
 
    
         //
@@ -270,7 +307,7 @@ const Radio = (props: RadioProps) => {
 
         //----
         //remove focus style
-        rootRef.current.classList.remove('focus');
+        rootRef.current?.classList.remove('focus');
 
         //
         onBlur?.(event);
@@ -374,6 +411,8 @@ const Radio = (props: RadioProps) => {
         const _params: any[] = fetchFuncMethodParams || [];
         fetchData((_params).join(','));
 
+
+
     }, [value, options]);
 
 
@@ -381,7 +420,11 @@ const Radio = (props: RadioProps) => {
         <>
 
 
-            <div id={`radio__wrapper-${idRes}`} className={`radio__wrapper ${wrapperClassName || wrapperClassName === '' ? wrapperClassName : 'mb-3 position-relative'}`} ref={rootRef}>
+            <div 
+                id={`radio__wrapper-${idRes}`} 
+                className={`radio__wrapper ${wrapperClassName || wrapperClassName === '' ? wrapperClassName : 'mb-3 position-relative'}`} 
+                ref={rootRef}
+            >
                 {label ? <>{typeof label === 'string' ? <label htmlFor={idRes} className="form-label" dangerouslySetInnerHTML={{ __html: `${label}` }}></label> : <label htmlFor={idRes} className="form-label" >{label}</label>}</> : null}
                 <div id={idRes}>
                     {!hasErr ? itemsList : null}

package/lib/esm/SearchBar/index.tsx

@@ -112,7 +112,7 @@ const SearchBar = forwardRef((props: SearchBarProps, ref: any) => {
     }
 
     function handleFocus(event: any) {
-        rootRef.current.classList.add('focus');
+        rootRef.current?.classList.add('focus');
 
         //
         onFocus?.(event, onComposition);
@@ -126,7 +126,7 @@ const SearchBar = forwardRef((props: SearchBarProps, ref: any) => {
         //----
         //remove focus style
         if (val === '') {
-            rootRef.current.classList.remove('focus');
+            rootRef.current?.classList.remove('focus');
         }
 
         //
@@ -141,7 +141,7 @@ const SearchBar = forwardRef((props: SearchBarProps, ref: any) => {
         //----
         //remove focus style
         if (val === '') {
-            rootRef.current.classList.remove('focus');
+            rootRef.current?.classList.remove('focus');
         }
 
         //

package/lib/esm/Select/index.tsx

@@ -212,7 +212,7 @@ const Select = forwardRef((props: SelectProps, ref: any) => {
 
     //
     function handleFocus(event: any) {
-        rootRef.current.classList.add('focus');
+        rootRef.current?.classList.add('focus');
 
         //
         onFocus?.(event);    
@@ -229,7 +229,7 @@ const Select = forwardRef((props: SelectProps, ref: any) => {
 
         //----
         //remove focus style
-        rootRef.current.classList.remove('focus');
+        rootRef.current?.classList.remove('focus');
 
         //
 		if ( typeof(onChange) === 'function' ) {
@@ -244,7 +244,7 @@ const Select = forwardRef((props: SelectProps, ref: any) => {
 
         //----
         //remove focus style
-        rootRef.current.classList.remove('focus');
+        rootRef.current?.classList.remove('focus');
 
         //
         onBlur?.(event);

package/lib/esm/Switch/index.tsx

@@ -54,7 +54,7 @@ const Switch = forwardRef((props: SwitchProps, ref: any) => {
     const [val, setVal] = useState<any>(null || false);  // Avoid the error "react checkbox changing an uncontrolled input to be controlled"
 
     function handleFocus(event: any) {
-        rootRef.current.classList.add('focus');
+        rootRef.current?.classList.add('focus');
 
         //
         onFocus?.(event);    
@@ -68,7 +68,7 @@ const Switch = forwardRef((props: SwitchProps, ref: any) => {
         
         //----
         //remove focus style
-        rootRef.current.classList.remove('focus');
+        rootRef.current?.classList.remove('focus');
 
         //
         if (typeof (onChange) === 'function') {
@@ -84,7 +84,7 @@ const Switch = forwardRef((props: SwitchProps, ref: any) => {
 
         //----
         //remove focus style
-        rootRef.current.classList.remove('focus');
+        rootRef.current?.classList.remove('focus');
 
         //
         onBlur?.(event);

package/lib/esm/Table/index.tsx

@@ -370,7 +370,7 @@ const Table = (props: TableProps) => {
     };
 
     function handleTbodyLeave(e: any) {
-        tbodyRef.current.classList.remove('drag-trigger-mousedown');
+        tbodyRef.current?.classList.remove('drag-trigger-mousedown');
     }
 
     // events fired on the drop targets
@@ -422,7 +422,7 @@ const Table = (props: TableProps) => {
         removePlaceholder();
 
         draggedObj.classList.remove( 'dragging' );
-        tbodyRef.current.classList.remove('drag-trigger-mousedown');
+        tbodyRef.current?.classList.remove('drag-trigger-mousedown');
         
 
         if ( overObj === null ) return;

package/lib/esm/TagInput/index.tsx

@@ -160,7 +160,7 @@ const TagInput = forwardRef((props: TagInputProps, ref: any) => {
         //----
         //remove focus style
         if (val === '') {
-            rootRef.current.classList.remove('focus');
+            rootRef.current?.classList.remove('focus');
         }
 
         //
@@ -186,7 +186,7 @@ const TagInput = forwardRef((props: TagInputProps, ref: any) => {
 
 
     function handleFocus(event: any) {
-        rootRef.current.classList.add('focus');
+        rootRef.current?.classList.add('focus');
 
         //
         onFocus?.(event);
@@ -201,7 +201,7 @@ const TagInput = forwardRef((props: TagInputProps, ref: any) => {
         //----
         //remove focus style
         if (val === '') {
-            rootRef.current.classList.remove('focus');
+            rootRef.current?.classList.remove('focus');
         }
 
         //

package/lib/esm/Textarea/index.tsx

@@ -104,7 +104,7 @@ const Textarea = forwardRef((props: TextareaProps, ref: any) => {
 
     function handleFocus(event: any) {
         const el = event.target;
-        rootRef.current.classList.add('focus');
+        rootRef.current?.classList.add('focus');
 
         //
         onFocus?.(event, valRef.current);     
@@ -118,7 +118,7 @@ const Textarea = forwardRef((props: TextareaProps, ref: any) => {
         //----
         //remove focus style
         if (val === '') {
-            rootRef.current.classList.remove('focus');
+            rootRef.current?.classList.remove('focus');
         }
 
         //
@@ -140,7 +140,7 @@ const Textarea = forwardRef((props: TextareaProps, ref: any) => {
         //----
         //remove focus style
         if (val === '') {
-            rootRef.current.classList.remove('focus');
+            rootRef.current?.classList.remove('focus');
         }
 
         //

package/package.json

@@ -2,7 +2,7 @@
   "author": "UIUX Lab",
   "email": "uiuxlab@gmail.com",
   "name": "funda-ui",
-  "version": "3.8.815",
+  "version": "3.8.821",
   "description": "React components using pure Bootstrap 5+ which does not contain any external style and script libraries.",
   "repository": {
     "type": "git",