funda-ui 4.4.15 → 4.4.35

package/lib/esm/ModalDialog/index.tsx

@@ -13,7 +13,6 @@ import {
 } from 'funda-utils/dist/cjs/bodyScrollLock';
 
 
-
 declare global {
     interface Window {
         curVideo?: any;

package/lib/esm/Table/Table.tsx

@@ -5,7 +5,6 @@ import useComId from 'funda-utils/dist/cjs/useComId';
 import { clsWrite, combinedCls } from 'funda-utils/dist/cjs/cls';
 
 
-
 import { TableProvider } from './TableContext';
 import useTableResponsive from './utils/hooks/useTableResponsive';
 import useTableDraggable from './utils/hooks/useTableDraggable';

package/lib/esm/Table/index.scss

@@ -15,6 +15,7 @@
     
     &.table-responsive {
         overflow-x: auto;
+        overflow-y: hidden;
 
         &::-webkit-scrollbar {
             height: var(--syntable-scrollbar-h);
@@ -164,6 +165,7 @@
 
             .row-obj-clonelast {
                 height: 0 !important;
+
              
                 td {
                     border: none;

package/lib/esm/Table/utils/hooks/useTableDraggable.tsx

@@ -64,7 +64,7 @@ function useTableDraggable({
 
     const placeholderGenerator = (trHeight: number) => {
         const tbodyRef: any = getTbody(spyElement);
-        if (tbodyRef === null) return;
+        if (tbodyRef === null || tbodyRef.querySelector('tr') === null) return;
 
         // Insert a row at the "index" of the table
         const newRow = document.createElement('tr');
@@ -85,7 +85,11 @@ function useTableDraggable({
 
     const lastRowGenerator = (trHeight: number) => {
         const tbodyRef: any = getTbody(spyElement);
-        if (tbodyRef === null) return;
+        if (tbodyRef === null || tbodyRef.querySelector('tr') === null) return;
+
+        const cloneEl = tbodyRef.querySelector('.row-obj-clonelast');
+        if (cloneEl !== null) return;
+
 
         // Insert a row at the "index" of the table
         const newRow = document.createElement('tr');
@@ -93,6 +97,7 @@ function useTableDraggable({
         newRow.dataset.order = allRows(spyElement).length.toString();
         newRow.style.height = trHeight + 'px';
         newRow.style.display = 'none';
+        
 
         // Insert a cell in the row at index
         const newCell = newRow.insertCell(0);
@@ -134,7 +139,14 @@ function useTableDraggable({
         setSortData(listIndexes);
 
         //last placeholder
-        insertAfter(lastRowGenerator((_allRows.at(-1) as any).clientHeight), _allRows.at(-1));
+        if (_allRows.length > 0) {
+            const lastEl: any = lastRowGenerator((_allRows.at(-1) as any).clientHeight);
+            if (typeof _allRows.at(-1) !== 'undefined') {
+                insertAfter(lastEl, _allRows.at(-1));
+            }
+        }
+
+        
     };
 
     const handleTbodyEnter = (e: any) => {
@@ -182,6 +194,9 @@ function useTableDraggable({
 
 
     const handleDragStart = useCallback((e: any) => {
+        const tbodyRef: any = getTbody(spyElement);
+        if (tbodyRef === null) return;
+
         draggedObj = e.currentTarget;
         e.dataTransfer.effectAllowed = 'move';
         e.dataTransfer.setData('text/html', draggedObj);
@@ -196,6 +211,15 @@ function useTableDraggable({
         };
         onRowDrag?.(dragStart, null);
 
+
+        // init clone <tr>
+        // !!! It needs to be put at the end of the code to fix the location of the clone element
+        const cloneEl = tbodyRef.querySelector('.row-obj-clonelast');
+        if (cloneEl !== null) {
+            cloneEl.style.display = 'none';
+        }
+
+
     }, [handledragOver]);
 
     const handleDragEnd = useCallback((e: any) => {
@@ -250,9 +274,12 @@ function useTableDraggable({
         // sort elements
         const categoryItemsArray = allRows(spyElement);
         const sorter = (a: any, b: any) => {
-            return a.dataset.order.localeCompare(b.dataset.order); // sorts based on alphabetical order
+            let txt1 = Number(a.dataset.order),
+                txt2 = Number(b.dataset.order);
+
+            return txt2 < txt1 ? -1 : txt2 > txt1 ? 1 : 0;
         }
-        const sorted = categoryItemsArray.sort(sorter);
+        const sorted = categoryItemsArray.sort(sorter).reverse();
         sorted.forEach(e => spyElement.querySelector('table').querySelector('tbody').appendChild(e));
 
 
@@ -264,13 +291,27 @@ function useTableDraggable({
 
 
 
+        // init clone <tr>
+        // !!! It needs to be put at the end of the code to fix the location of the clone element
+        const _allRows = allRows(spyElement);
+        const cloneEl = tbodyRef.querySelector('.row-obj-clonelast');
+        if (cloneEl !== null) {
+            if (typeof _allRows.at(-1) !== 'undefined') {
+                insertAfter(cloneEl, _allRows.at(-1));
+                cloneEl.style.display = 'none';
+            }
+        }
+   
+
+
     }, [sortData]);
 
 
 
     useEffect(() => {
         if (enabled) {
-            if (Array.isArray(data)) {
+            if (Array.isArray(data) && data.length > 0) {  
+                // !!! REQUIRED "data.length > 0" to avoid data-order cannot be assigned when asynchronous data is empty
                 data.forEach((item: any, i: number) => {
                     item.order = i;
                 });

package/lib/esm/TagInput/index.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useRef, forwardRef, ChangeEvent, MouseEvent, KeyboardEvent, FocusEvent, CompositionEvent } from 'react';
+import React, { useState, useEffect, useRef, forwardRef, useImperativeHandle, ChangeEvent, MouseEvent, KeyboardEvent, FocusEvent, CompositionEvent } from 'react';
 
 
 
@@ -14,6 +14,7 @@ import { clsWrite, combinedCls } from 'funda-utils/dist/cjs/cls';
 
 
 export type TagInputProps = {
+    contentRef?: React.ForwardedRef<any>;
     wrapperClassName?: string;
     value?: string;
     maxTags?: number;
@@ -45,6 +46,7 @@ export type TagInputProps = {
 
 const TagInput = forwardRef((props: TagInputProps, externalRef: any) => {
     const {
+        contentRef,
         wrapperClassName,
         maxTags,
         disabled,
@@ -85,6 +87,26 @@ const TagInput = forwardRef((props: TagInputProps, externalRef: any) => {
     const [onComposition, setOnComposition] = useState<boolean>(false);
 
 
+    // exposes the following methods
+    useImperativeHandle(
+        contentRef,
+        () => ({
+            control: () => {
+                return valRef.current;
+            },
+            clear: (cb?: any) => {
+                initDefaultValue('');
+                cb?.();
+            },
+            set: (value: string, cb?: any) => {
+                initDefaultValue(`${value}`);
+                cb?.();
+            }
+        }),
+        [contentRef],
+    );
+
+
     function initDefaultValue(defaultValue: any) {
 
         // change the value to trigger component rendering

package/lib/esm/Utils/libs/object.ts

@@ -1,68 +1,68 @@
-
-/**
- * Remove Duplicate objects from JSON Array
- * @param {Array} obj 
- * @param {String} fieldName 
- */
-function removeArrDuplicateItems(obj: any[], fieldName: string): any[] {
-    if (!Array.isArray(obj)) return [];
-
-    const clean = obj.filter((item, index, self) => index === self.findIndex((t) => (t[fieldName] === item[fieldName])));
-    return clean;
-};
-
-
-/**
- * Deep clone
- * @param {*} obj 
- */
-function deepClone(obj: any): any {
-    if (Array.isArray(obj)) {
-        return (obj).map((item) => deepClone(item));
-    } else if (typeof obj === 'object' && obj !== null) {
-        const clone: any = {};
-        for (let key in obj) {
-            if (obj.hasOwnProperty(key)) {
-                clone[key] = deepClone(obj[key]);
-            }
-        }
-        return clone;
-    } else {
-        return obj;
-    }
-}
-
-
-/**
- * Flat Data
- * @param {*} data 
- * @returns 
- */
-function flatData(data: any): any[] {
-    const result: any[] = [];
-    const iterate = (obj: any) => {
-        if (!obj) {
-            return;
-        }
-        obj.forEach((item: any) => {
-            result.push(item);
-            if (item.children) {
-                iterate(item.children);
-            }
-
-            // delete current item children
-            delete item.children;
-
-        })
-    }
-
-    iterate(data);
-    return result;
-}
-
-
-export {
-    removeArrDuplicateItems,
-    deepClone,
-    flatData
+
+/**
+ * Remove Duplicate objects from JSON Array
+ * @param {Array} obj 
+ * @param {String} fieldName 
+ */
+function removeArrDuplicateItems(obj: any[], fieldName: string): any[] {
+    if (!Array.isArray(obj)) return [];
+
+    const clean = obj.filter((item, index, self) => index === self.findIndex((t) => (t[fieldName] === item[fieldName])));
+    return clean;
+};
+
+
+/**
+ * Deep clone
+ * @param {*} obj 
+ */
+function deepClone(obj: any): any {
+    if (Array.isArray(obj)) {
+        return (obj).map((item) => deepClone(item));
+    } else if (typeof obj === 'object' && obj !== null) {
+        const clone: any = {};
+        for (let key in obj) {
+            if (obj.hasOwnProperty(key)) {
+                clone[key] = deepClone(obj[key]);
+            }
+        }
+        return clone;
+    } else {
+        return obj;
+    }
+}
+
+
+/**
+ * Flat Data
+ * @param {*} data 
+ * @returns 
+ */
+function flatData(data: any): any[] {
+    const result: any[] = [];
+    const iterate = (obj: any) => {
+        if (!obj) {
+            return;
+        }
+        obj.forEach((item: any) => {
+            result.push(item);
+            if (item.children) {
+                iterate(item.children);
+            }
+
+            // delete current item children
+            delete item.children;
+
+        })
+    }
+
+    iterate(data);
+    return result;
+}
+
+
+export {
+    removeArrDuplicateItems,
+    deepClone,
+    flatData
 }

package/lib/esm/Utils/libs/os.ts

@@ -0,0 +1,63 @@
+
+
+/*
+ * Determine whether it is a special platform
+ *
+ * @private
+ */
+function getOs() {
+    if (typeof window === 'undefined') return {};
+
+    let os;
+
+    if ( typeof window !== "undefined" ) {
+    
+        const getOs = () => {
+            const _navigator: any = window.navigator;
+            const platform = () => {
+                // 2022 way of detecting. Note : this userAgentData feature is available only in secure contexts (HTTPS)
+                if (typeof _navigator.userAgentData !== 'undefined' && _navigator.userAgentData != null) {
+                    return _navigator.userAgentData.platform;
+                }
+                // Deprecated but still works for most of the browser
+                if (typeof _navigator.platform !== 'undefined') {
+                    if (typeof _navigator.userAgent !== 'undefined' && /android/.test(_navigator.userAgent.toLowerCase())) {
+                        // android device’s _navigator.platform is often set as 'linux', so const’s use userAgent for them
+                        return 'android';
+                    }
+                    return _navigator.platform;
+                }
+                return 'unknown';
+            }
+        
+            const _platform = platform().toLowerCase();
+        
+            const isOSX = /mac/.test(_platform); // Mac desktop
+            const isIOS = ['iphone', 'ipad', 'ipod'].indexOf(_platform) === -1 ? false : true; // Mac iOs
+            const isApple = isOSX || isIOS; // Apple device (desktop or iOS)
+            const isWindows = /win/.test(_platform); // Windows
+            const isAndroid = /android/.test(_platform); // Android
+            const isLinux = /linux/.test(_platform); // Linux
+        
+            return {
+                isOSX,
+                isIOS,
+                isApple,
+                isWindows,
+                isAndroid,
+                isLinux
+            }
+        
+        };
+    
+        os = getOs();
+    
+    } else {
+        os = {};
+    }
+    return os;
+
+}
+
+
+export default getOs;

package/package.json

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