react-restyle-components 0.2.86 → 0.2.88

package/lib/src/core-components/molecules/auto-complete-filter-multiple-select-multiple-fields-display/auto-complete-filter-multiple-select-multiple-fields-display.component.js

@@ -1,100 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-/* eslint-disable  */
-import { useState, useEffect, useRef } from 'react';
-import { Icon } from '../../atoms/icons/icons.component';
-import s from '../../../tc.module.css';
-import { cn, debounce } from '../../../core-utils';
-export const AutoCompleteFilterMultipleSelectMultipleFieldsDisplay = ({ uniqueField = '_id', isSelectedStringArray = false, loader = false, placeholder = 'Search...', data, hasError = false, disable = false, isUpperCase = false, name, onFilter, onUpdate, onSelect, onBlur, }) => {
-    const [value, setValue] = useState('');
-    const [options, setOptions] = useState();
-    const [originalOptions, setOriginalOptions] = useState();
-    const [isListOpen, setIsListOpen] = useState(false);
-    const useOutsideAlerter = (ref) => {
-        useEffect(() => {
-            function handleClickOutside(event) {
-                if (ref.current && !ref.current.contains(event.target) && isListOpen) {
-                    if (originalOptions && options) {
-                        if (isListOpen) {
-                            onUpdate && onUpdate(data.selected);
-                        }
-                    }
-                    setIsListOpen(false);
-                    setValue('');
-                }
-            }
-            document.addEventListener('mousedown', handleClickOutside);
-            return () => {
-                document.removeEventListener('mousedown', handleClickOutside);
-            };
-        }, [ref, isListOpen]);
-    };
-    const wrapperRef = useRef(null);
-    useOutsideAlerter(wrapperRef);
-    let count = 0;
-    const getSelectedItem = (selectedItem, list) => {
-        if (count === 0) {
-            const finalList = list?.filter((item, index) => {
-                item.selected = false;
-                selectedItem && selectedItem.length > 0
-                    ? selectedItem.find((sItem, index) => {
-                        if (isSelectedStringArray) {
-                            if (sItem === item[uniqueField]) {
-                                item.selected = true;
-                            }
-                        }
-                        else {
-                            if (sItem[uniqueField] === item[uniqueField]) {
-                                item.selected = true;
-                            }
-                        }
-                    })
-                    : (item.selected = false);
-                count++;
-                return item;
-            });
-            list = finalList;
-        }
-        return list;
-    };
-    useEffect(() => {
-        setOriginalOptions(getSelectedItem(data.selected, data.list));
-        setOptions(getSelectedItem(data.selected, data.list));
-    }, [data, data.selected]);
-    const onChange = (e) => {
-        const search = e.target.value;
-        setValue(search);
-        debounce(() => {
-            onFilter && onFilter(search);
-        });
-    };
-    const onKeyUp = (e) => {
-        const charCode = e.which ? e.which : e.keyCode;
-        if (charCode === 8) {
-            const search = e.target.value;
-            debounce(() => {
-                onFilter && onFilter(search);
-            });
-        }
-    };
-    return (_jsx(_Fragment, { children: _jsxs("div", { ref: wrapperRef, className: cn(s['w-full'], s['relative']), children: [_jsxs("div", { className: cn(s['flex'], s['items-center'], s['leading-4'], s['p-2'], s['focus:outline-none'], s['focus:ring'], s['w-full'], s['shadow-sm'], s['sm:text-base'], s['border'], s['rounded-md'], {
-                        [s['border-red']]: hasError,
-                        [s['border-gray-300']]: !hasError,
-                    }), children: [_jsx("input", { placeholder: placeholder, disabled: disable, name: name, value: !isListOpen
-                                ? data?.selected?.length > 0
-                                    ? `${(data.selected && data.selected.length) || 0} Items`
-                                    : value
-                                : isUpperCase
-                                    ? value?.toUpperCase()
-                                    : value, className: cn(s['w-full'], s['focus:outline-none'], s['bg-none']), onKeyUp: onKeyUp, onChange: onChange, onClick: () => setIsListOpen(true), onBlur: (e) => onBlur && onBlur(e) }), isListOpen ? (_jsx(Icon, { nameIcon: "FaChevronUp", propsIcon: {
-                                color: '#000000',
-                                size: 22,
-                            } })) : (_jsx(Icon, { nameIcon: "FaChevronDown", propsIcon: {
-                                color: '#000000',
-                                size: 22,
-                            } }))] }), options && isListOpen
-                    ? options?.length > 0 && (_jsx("div", { className: cn(s['flex'], s['mt-1'], s['absolute'], s['rounded-sm'], s['z-500'], s['w-full']), style: { zIndex: 80 }, children: _jsx("ul", { className: cn(s['flex'], s['flex-col'], s['gap-2'], s['bg-gray-200'], s['p-2'], s['w-full']), children: options?.map((item, index) => (_jsx(_Fragment, { children: _jsx("li", { className: cn(s['flex'], s['gap-4'], s['p-2']), children: _jsxs("label", { className: cn(s['flex']), children: [_jsx("input", { id: index?.toString(), className: cn(s['flex'], s['h-4'], s['w-4']), type: "checkbox", checked: item.selected, onChange: () => onSelect(item) }), ' ', _jsx("span", { className: cn(s['flex'], s['h-4'], s['ml-2']), children: data.displayKey
-                                                    .map((key) => `${item[key]}
-                              `)
-                                                    .join(' - ') })] }) }, index) }))) }) }))
-                    : null] }) }));
-};

package/lib/src/core-components/molecules/auto-complete-filter-single-select/auto-complete-filter-single-select.component.d.ts

@@ -1,13 +0,0 @@
-interface AutoCompleteFilterSingleSelectProps {
-    loader?: boolean;
-    disable?: boolean;
-    displayValue?: string;
-    placeholder?: string;
-    data: any;
-    hasError?: boolean;
-    onFilter: (item: any) => void;
-    onSelect: (item: any) => any;
-}
-export declare const AutoCompleteFilterSingleSelect: ({ disable, loader, displayValue, placeholder, data, hasError, onFilter, onSelect, }: AutoCompleteFilterSingleSelectProps) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=auto-complete-filter-single-select.component.d.ts.map

package/lib/src/core-components/molecules/auto-complete-filter-single-select/auto-complete-filter-single-select.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"auto-complete-filter-single-select.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/molecules/auto-complete-filter-single-select/auto-complete-filter-single-select.component.tsx"],"names":[],"mappings":"AAOA,UAAU,mCAAmC;IAC3C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,EAAE,GAAG,CAAC;IACV,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC9B,QAAQ,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,GAAG,CAAC;CAC9B;AAED,eAAO,MAAM,8BAA8B,wFASxC,mCAAmC,4CAuIrC,CAAC"}

package/lib/src/core-components/molecules/auto-complete-filter-single-select/auto-complete-filter-single-select.component.js

@@ -1,59 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-/* eslint-disable  */
-import { useState, useEffect, useRef } from 'react';
-import { Icon } from '../../atoms/icons/icons.component';
-import { debounce } from '../../../core-utils';
-import s from '../../../tc.module.css';
-import { cn } from '../../../core-utils';
-export const AutoCompleteFilterSingleSelect = ({ disable = false, loader = false, displayValue = '', placeholder = 'Search...', data, hasError = false, onFilter, onSelect, }) => {
-    const [value, setValue] = useState(displayValue);
-    const [options, setOptions] = useState();
-    const [isListOpen, setIsListOpen] = useState(false);
-    const useOutsideAlerter = (ref) => {
-        useEffect(() => {
-            function handleClickOutside(event) {
-                if (ref.current && !ref.current.contains(event.target) && isListOpen) {
-                    setIsListOpen(false);
-                    setValue('');
-                }
-            }
-            document.addEventListener('mousedown', handleClickOutside);
-            return () => {
-                document.removeEventListener('mousedown', handleClickOutside);
-            };
-        }, [ref, isListOpen]);
-    };
-    const wrapperRef = useRef(null);
-    useOutsideAlerter(wrapperRef);
-    useEffect(() => {
-        setOptions(data.list);
-    }, [data]);
-    useEffect(() => {
-        setValue(displayValue);
-    }, [displayValue]);
-    const handleInputChange = (e) => {
-        const search = e.target.value;
-        setValue(search);
-        const filteredOptions = data.list.filter((item) => item[data.displayKey].toLowerCase().includes(search.toLowerCase()));
-        setOptions(filteredOptions);
-        debounce(() => {
-            onFilter(search);
-        });
-    };
-    return (_jsx(_Fragment, { children: _jsxs("div", { ref: wrapperRef, children: [_jsxs("div", { className: cn(s['flex'], s['items-center'], s['leading-4'], s['p-2'], s['focus:outline-none'], s['focus:ring'], s['w-full'], s['shadow-sm'], s['sm:text-base'], s['border'], s['rounded-md'], {
-                        [s['border-red']]: hasError,
-                        [s['border-gray-300']]: !hasError,
-                    }), children: [_jsx("input", { placeholder: placeholder, value: !isListOpen ? value : value, className: cn(s['w-full'], s['focus:outline-none'], s['bg-none']), onChange: handleInputChange, onClick: () => setIsListOpen(true), disabled: disable }), isListOpen ? (_jsx(Icon, { nameIcon: "FaChevronUp", propsIcon: {
-                                color: '#000000',
-                                size: 22,
-                            } })) : (_jsx(Icon, { nameIcon: "FaChevronDown", propsIcon: {
-                                color: '#000000',
-                                size: 22,
-                            } }))] }), options && isListOpen
-                    ? options.length > 0 && (_jsx("div", { className: cn(s['mt-1'], s['absolute'], s['bg-gray-100'], s['p-2'], s['rounded-sm'], s['z-50']), children: _jsx("ul", { children: options?.map((item, index) => (_jsx(_Fragment, { children: _jsx("li", { className: cn(s['text-gray-400'], s['flex'], s['items-center']), onClick: () => {
-                                        setValue(item[data.displayKey]);
-                                        setIsListOpen(false);
-                                        onSelect(item);
-                                    }, children: _jsx("label", { className: cn(s['ml-2'], s['mt-1'], s['text-black']), children: item[data.displayKey] }) }, index) }))) }) }))
-                    : null] }) }));
-};

package/lib/src/core-components/molecules/auto-complete-filter-single-select-multiple-fields-display/auto-complete-filter-single-select-multiple-fields-display.component.d.ts

@@ -1,18 +0,0 @@
-import '../../../tc.module.css';
-interface AutoCompleteFilterSingleSelectMultiFieldsDisplayProps {
-    loader?: boolean;
-    disable?: boolean;
-    displayValue?: string;
-    placeholder?: string;
-    data: any;
-    hasError?: boolean;
-    className?: string;
-    posstion?: string;
-    keyboard?: string;
-    onFilter?: (item: any) => void;
-    onSelect?: (item: any) => any;
-    onBlur?: (item: any) => any;
-}
-export declare const AutoCompleteFilterSingleSelectMultiFieldsDisplay: ({ disable, loader, displayValue, placeholder, data, hasError, className, posstion, keyboard, onFilter, onSelect, onBlur, }: AutoCompleteFilterSingleSelectMultiFieldsDisplayProps) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=auto-complete-filter-single-select-multiple-fields-display.component.d.ts.map

package/lib/src/core-components/molecules/auto-complete-filter-single-select-multiple-fields-display/auto-complete-filter-single-select-multiple-fields-display.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"auto-complete-filter-single-select-multiple-fields-display.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/molecules/auto-complete-filter-single-select-multiple-fields-display/auto-complete-filter-single-select-multiple-fields-display.component.tsx"],"names":[],"mappings":"AAIA,OAAO,wBAAwB,CAAC;AAIhC,UAAU,qDAAqD;IAC7D,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,EAAE,GAAG,CAAC;IACV,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC/B,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,GAAG,CAAC;IAC9B,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,GAAG,CAAC;CAC7B;AAED,eAAO,MAAM,gDAAgD,+HAa1D,qDAAqD,4CAiNvD,CAAC"}

package/lib/src/core-components/molecules/auto-complete-filter-single-select-multiple-fields-display/auto-complete-filter-single-select-multiple-fields-display.component.js

@@ -1,108 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-/* eslint-disable  */
-import { useState, useEffect, useRef } from 'react';
-import { Icon } from '../../atoms/icons/icons.component';
-import '../../../tc.module.css';
-import s from '../../../tc.module.css';
-import { cn, debounce } from '../../../core-utils';
-export const AutoCompleteFilterSingleSelectMultiFieldsDisplay = ({ disable = false, loader = false, displayValue = '', placeholder = 'Search...', data, hasError = false, className, posstion = 'absolute', keyboard = 'text', onFilter, onSelect, onBlur, }) => {
-    const [value, setValue] = useState(displayValue);
-    const [options, setOptions] = useState(data.list);
-    const [isListOpen, setIsListOpen] = useState(false);
-    const [filterValue, setFilterValue] = useState();
-    const useOutsideAlerter = (ref) => {
-        useEffect(() => {
-            function handleClickOutside(event) {
-                if (ref.current && !ref.current.contains(event.target) && isListOpen) {
-                    setIsListOpen(false);
-                    //setValue('');
-                }
-            }
-            document.addEventListener('mousedown', handleClickOutside);
-            return () => {
-                document.removeEventListener('mousedown', handleClickOutside);
-            };
-        }, [ref, isListOpen]);
-    };
-    const inputRef = useRef(null);
-    const wrapperRef = useRef(null);
-    useOutsideAlerter(wrapperRef);
-    useEffect(() => {
-        setOptions(data.list);
-    }, [data]);
-    useEffect(() => {
-        setValue(displayValue);
-    }, [displayValue]);
-    const onChange = (e) => {
-        const search = e.target.value;
-        setValue(search);
-        setFilterValue(search);
-        const filteredOptions = data.list.filter((item) => data.displayKey.some((key) => item[key]?.toString().toLowerCase().includes(search.toLowerCase())));
-        setOptions(filteredOptions);
-        debounce(() => {
-            onFilter && onFilter(search);
-        });
-    };
-    const onKeyUp = (e) => {
-        const charCode = e.which ? e.which : e.keyCode;
-        if (charCode === 8) {
-            const search = e.target.value;
-            debounce(() => {
-                onFilter && onFilter(search);
-            });
-        }
-    };
-    const onKeyDown = (e) => {
-        if (e.key === 'Enter' || e.key === 'Tab') {
-            if (options.length > 0) {
-                const selectedItem = options.find((item) => item.labId === Number(value));
-                if (selectedItem) {
-                    setValue(data.displayKey.map((key) => `${selectedItem[key]}`).join(' - '));
-                    setIsListOpen(false);
-                    onSelect && onSelect(selectedItem);
-                }
-            }
-        }
-    };
-    const calculateMaxHeight = () => {
-        if (inputRef.current) {
-            const inputRect = inputRef.current.getBoundingClientRect();
-            const availableHeight = window.innerHeight - inputRect.bottom - 20; // 10px padding
-            return availableHeight;
-        }
-        return 'calc(100vh - 140px)';
-    };
-    return (_jsx(_Fragment, { children: _jsxs("div", { ref: wrapperRef, className: "w-full relative", children: [_jsxs("div", { className: cn(s['flex'], s['p-2'], s['leading-4'], s['focus:outline-none'], s['focus:ring'], s['w-full'], s['shadow-sm'], s['sm:text-base'], s['border'], s['rounded-md'], {
-                        [s['border-red']]: hasError,
-                        [s['border-gray-300']]: !hasError,
-                        [s['dark:text-black']]: true,
-                    }), children: [_jsx("input", { ref: inputRef, placeholder: placeholder, type: keyboard, value: value, className: cn(s['w-full'], s['focus:outline-none'], s['bg-none'], s['dark:text-black'], className), onKeyUp: onKeyUp, onChange: onChange, onClick: () => setIsListOpen(true), disabled: disable, onMouseDown: () => setValue(''), onBlur: (e) => onBlur && onBlur(e), onKeyDown: onKeyDown }), isListOpen ? (_jsx(Icon, { nameIcon: "FaChevronUp", propsIcon: {
-                                color: '#000000',
-                                size: 22,
-                            } })) : (_jsx(Icon, { nameIcon: "FaChevronDown", propsIcon: {
-                                color: '#000000',
-                                size: 22,
-                            } }))] }), options && isListOpen
-                    ? options.length > 0 && (_jsx("div", { className: cn(s['absolute'], s['w-full'], s['bg-gray-100'], s['p-2'], s['rounded-sm'], s['overflow-y-auto']), style: {
-                            zIndex: 500,
-                            maxHeight: `${calculateMaxHeight()}px`,
-                        }, children: _jsx("ul", { children: options?.map((item, index) => (_jsx("li", { className: cn(s['text-gray-400'], s['flex'], s['items-center']), onClick: () => {
-                                    setValue(data.displayKey
-                                        .map((key) => item[key])
-                                        .filter((value) => value !== null && value !== undefined)
-                                        .join(' - '));
-                                    setIsListOpen(false);
-                                    onSelect && onSelect(item);
-                                }, children: _jsx("label", { className: cn(s['ml-2'], s['mt-1'], s['text-black']), style: {
-                                        textOverflow: 'ellipsis',
-                                        minWidth: 0,
-                                        overflow: 'hidden',
-                                        whiteSpace: 'nowrap',
-                                    }, title: data.displayKey
-                                        .map((key) => item[key])
-                                        .join(' - '), children: data.displayKey
-                                        .map((key) => item[key])
-                                        .filter((value) => value !== null && value !== undefined)
-                                        .join(' - ') }) }, index))) }) }))
-                    : null] }) }));
-};

package/lib/src/core-components/molecules/auto-complete-group-by/auto-complete-group-by.component.d.ts

@@ -1,10 +0,0 @@
-interface AutocompleteGroupByProps {
-    data: any[];
-    hasError?: boolean;
-    displayValue?: string;
-    onChange?: (item: any, children: any) => void;
-    onClose?: () => void;
-}
-export declare const AutocompleteGroupBy: ({ data, hasError, displayValue, onChange, onClose, }: AutocompleteGroupByProps) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=auto-complete-group-by.component.d.ts.map

package/lib/src/core-components/molecules/auto-complete-group-by/auto-complete-group-by.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"auto-complete-group-by.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/molecules/auto-complete-group-by/auto-complete-group-by.component.tsx"],"names":[],"mappings":"AAMA,UAAU,wBAAwB;IAChC,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,KAAK,IAAI,CAAC;IAC9C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,eAAO,MAAM,mBAAmB,yDAM7B,wBAAwB,4CAiP1B,CAAC"}

package/lib/src/core-components/molecules/auto-complete-group-by/auto-complete-group-by.component.js

@@ -1,128 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-/* eslint-disable  */
-import { useState, useEffect, useRef } from 'react';
-import { Icon } from '../../atoms/icons/icons.component';
-import s from '../../../tc.module.css';
-import { cn } from '../../../core-utils';
-export const AutocompleteGroupBy = ({ data = [], hasError = false, displayValue = '', onChange, onClose, }) => {
-    //const [userRouter, setUserRouter] = useState<any>()
-    const [value, setValue] = useState(displayValue);
-    const [options, setOptions] = useState();
-    const [isListOpen, setIsListOpen] = useState(false);
-    const useOutsideAlerter = (ref) => {
-        useEffect(() => {
-            /**
-             * Alert if clicked on outside of element
-             */
-            function handleClickOutside(event) {
-                if (ref.current && !ref.current.contains(event.target) && isListOpen) {
-                    setIsListOpen(false);
-                    setValue('');
-                }
-            }
-            // Bind the event listener
-            document.addEventListener('mousedown', handleClickOutside);
-            return () => {
-                // Unbind the event listener on clean up
-                document.removeEventListener('mousedown', handleClickOutside);
-            };
-        }, [ref, isListOpen]);
-    };
-    const wrapperRef = useRef(null);
-    useOutsideAlerter(wrapperRef);
-    useEffect(() => {
-        setValue(displayValue);
-    }, [displayValue]);
-    useEffect(() => {
-        setOptions(data || []);
-    }, [data]);
-    const uniqByKeepFirst = (a, key) => {
-        const seen = new Set();
-        return a.filter((item) => {
-            const k = key(item);
-            return seen.has(k) ? false : seen.add(k);
-        });
-    };
-    const filter = (search, data) => {
-        if (search !== '') {
-            let filterArray = [];
-            data.filter((item) => {
-                item.children.filter((children) => {
-                    const childrenItem = children.title &&
-                        children.title.toLowerCase().indexOf(search.toLowerCase()) > -1;
-                    if (childrenItem) {
-                        const isSameArray = filterArray.filter((filterItem, index) => {
-                            if (filterItem.name === item.name) {
-                                const newChildren = filterArray[index].children.concat(children);
-                                filterArray[index] = {
-                                    ...filterArray[index],
-                                    children: newChildren,
-                                };
-                            }
-                        });
-                        if (isSameArray.length < 1) {
-                            filterArray.push({ ...item, children: [children] });
-                        }
-                        const uniqueChars = uniqByKeepFirst(filterArray, (it) => it.name);
-                        filterArray = uniqueChars;
-                    }
-                });
-            });
-            setOptions(filterArray);
-        }
-        else {
-            setOptions(data);
-        }
-    };
-    const onChangeValue = (e) => {
-        const search = e.target.value;
-        setValue(search);
-        filter(search, data);
-    };
-    return (_jsx(_Fragment, { children: _jsxs("div", { ref: wrapperRef, className: s['w-full'] + ' ' + s['relative'], children: [_jsxs("div", { className: cn(s['flex'], s['items-center'], s['leading-4'], s['p-2'], s['bg-white'], s['focus:outline-none'], s['focus:ring'], s['w-full'], s['shadow-sm'], s['sm:text-base'], s['border'], s['rounded-md'], {
-                        [s['border-red']]: hasError,
-                        [s['border-gray-300']]: !hasError,
-                    }), children: [_jsx("input", { placeholder: "Search...", value: !isListOpen ? value : value, className: cn(s['w-full'] + ' ' + s['focus:outline-none']), 
-                            // onKeyUp={onKeyUp}
-                            onChange: onChangeValue, onClick: () => setIsListOpen(true), onKeyDown: (e) => {
-                                if (e.key === 'Enter') {
-                                    e.preventDefault();
-                                    // Find the selected item and children
-                                    let selectedItem = null;
-                                    let selectedChildren = null;
-                                    for (const item of options) {
-                                        for (const children of item.children) {
-                                            if (children.title.toLowerCase() === value.toLowerCase() ||
-                                                item.title.toLowerCase() === value.toLowerCase()) {
-                                                selectedItem = item;
-                                                selectedChildren = children;
-                                                break;
-                                            }
-                                        }
-                                        if (selectedItem) {
-                                            break;
-                                        }
-                                    }
-                                    // Call props.onChange with the selected item and children
-                                    if (onChange && selectedItem && selectedChildren) {
-                                        onChange(selectedItem, selectedChildren);
-                                    }
-                                    setIsListOpen(false);
-                                    setValue(value); // Set the value to what the user entered
-                                    setOptions([]);
-                                }
-                            } }), isListOpen ? (_jsx(Icon, { nameIcon: "FaChevronUp", propsIcon: {
-                                color: '#000000',
-                                size: 22,
-                            } })) : (_jsx(Icon, { nameIcon: "FaChevronDown", propsIcon: {
-                                color: '#000000',
-                                size: 22,
-                            } }))] }), options && isListOpen
-                    ? options?.length > 0 && (_jsx("div", { className: cn(s['flex'], s['mt-1'], s['absolute'], s['z-50'], s['rounded-md'], s['bg-gray-200'], s['w-100'], s['w-full']), children: _jsx("ul", { className: cn(s['flex'], s['p-2'], s['rounded-sm'], s['w-full']), children: _jsx("div", { className: cn(s['flex'], s['flex-col'], s['w-full'], s['overflow-scroll']), style: { height: 'auto', maxHeight: '350px' }, children: options?.map((item, index) => (_jsxs(_Fragment, { children: [_jsx("li", { className: cn(s['flex'] + ' ' + s['text-gray-400']), children: item.title }, index), _jsx("ul", { className: cn(s['flex'], s['flex-col'], s['ml-4'], s['w-full']), children: item?.children?.map((children, childrenIndex) => (_jsx("li", { className: cn(s['flex'], s['hover:bg-gray-200'], s['focus:outline-none'], s['cursor-pointer'], s['w-full']), onClick: async () => {
-                                                    onChange && onChange(item, children);
-                                                    setIsListOpen(false);
-                                                    setValue(children.title);
-                                                    setOptions([]);
-                                                }, children: children.title }, childrenIndex))) })] }))) }) }) }))
-                    : null] }) }));
-};

package/lib/src/core-components/molecules/autocomplete/autocomplete.css

@@ -1,37 +0,0 @@
-.no-options {
-  position: relative;
-  padding: 0 10px 0px 10px;
-  /* background: white; */
-  background-color: #f3f6f4;
-  color: black;
-}
-
-.autocomplete-list {
-  list-style: none;
-  position: relative;
-  margin-top: 0;
-  padding: 0 10px 0px 10px;
-  min-height: auto;
-  max-height: 86vh;
-  overflow-y: auto;
-  /* background: white; */
-  background-color: #f3f6f4;
-  z-index: 1;
-}
-
-.autocomplete-list li {
-  /* padding: 4px; */
-  color: var(--input-autocomplete-item-text, #000);
-}
-
-.autocomplete-list li.active-option {
-  background-color: #f3f6f4;
-  background: var(--multiselect-item-hover);
-  cursor: pointer;
-  font-weight: bold;
-}
-.autocomplete-list li:hover {
-  background-color: #f3f6f4;
-  background: var(--multiselect-item-hover);
-  cursor: pointer;
-}

package/lib/src/core-components/molecules/autocomplete/autocomplete.d.ts

@@ -1,8 +0,0 @@
-interface AutocompleteProps {
-    value: string;
-    onValueChange: (value: string) => void;
-    options?: string[];
-}
-export declare const Autocomplete: ({ value, onValueChange, options, }: AutocompleteProps) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=autocomplete.d.ts.map

package/lib/src/core-components/molecules/autocomplete/autocomplete.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"autocomplete.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/molecules/autocomplete/autocomplete.tsx"],"names":[],"mappings":"AAMA,UAAU,iBAAiB;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;CACpB;AAED,eAAO,MAAM,YAAY,uCAItB,iBAAiB,4CAgNnB,CAAC"}

package/lib/src/core-components/molecules/autocomplete/autocomplete.js

@@ -1,108 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useRef, useEffect, useCallback } from 'react';
-import s from '../../../tc.module.css';
-import { cn } from '../../../core-utils';
-const LI_ELEMENT_HEIGHT = 34;
-export const Autocomplete = ({ value = '', onValueChange, options = [], }) => {
-    const [activeOption, setActiveOption] = useState(value === '' || options.indexOf(value) === -1 ? 0 : options.indexOf(value));
-    const [filteredOptions, setFilteredOptions] = useState(options);
-    const [shouldShowList, setShouldShowList] = useState(false);
-    const [searchValue, setSearchValue] = useState(value);
-    const inputRef = useRef(null);
-    const listRef = useRef(null);
-    const onInputChange = useCallback((event) => {
-        const input = event.target.value;
-        if (input != '') {
-            const newFilteredOptions = options.filter((option) => option.toLowerCase().indexOf(input.toLowerCase()) > -1);
-            setFilteredOptions(newFilteredOptions);
-        }
-        else {
-            setFilteredOptions(options);
-        }
-        setActiveOption(0);
-        setShouldShowList(true);
-        setSearchValue(input);
-    }, [
-        setActiveOption,
-        setFilteredOptions,
-        setShouldShowList,
-        setSearchValue,
-        onValueChange,
-    ]);
-    const onOptionClick = useCallback((event) => {
-        const symbol = event.currentTarget.innerText || event.currentTarget.textContent || '';
-        setShouldShowList(false);
-        setActiveOption(0);
-        setFilteredOptions([]);
-        setSearchValue(symbol);
-        onValueChange(symbol);
-    }, [
-        setShouldShowList,
-        setActiveOption,
-        setFilteredOptions,
-        setSearchValue,
-        onValueChange,
-    ]);
-    const onKeyDown = useCallback((event) => {
-        let selectedItem = '';
-        if (event.keyCode === 38) {
-            // arrow up
-            event.preventDefault();
-            if (activeOption === 0) {
-                return;
-            }
-            else {
-                selectedItem = filteredOptions[activeOption - 1];
-                setSearchValue(filteredOptions[activeOption - 1]);
-                setActiveOption(activeOption - 1);
-                listRef.current?.scroll({
-                    top: LI_ELEMENT_HEIGHT * (activeOption - 1),
-                });
-            }
-        }
-        else if (event.keyCode === 40) {
-            // arrow down
-            event.preventDefault();
-            if (activeOption === filteredOptions.length - 1) {
-                return;
-            }
-            else {
-                selectedItem = filteredOptions[activeOption + 1];
-                setSearchValue(filteredOptions[activeOption + 1]);
-                setActiveOption(activeOption + 1);
-                listRef.current?.scroll({
-                    top: LI_ELEMENT_HEIGHT * (activeOption + 1),
-                });
-            }
-        }
-        if (Object.keys(selectedItem)?.length > 0) {
-            onValueChange(selectedItem);
-        }
-    }, [
-        setActiveOption,
-        setSearchValue,
-        filteredOptions,
-        activeOption,
-        onValueChange,
-    ]);
-    const renderList = () => {
-        return (_jsx(_Fragment, { children: shouldShowList ? (_jsx(_Fragment, { children: _jsx("div", { className: cn(s['flex'], s['absolute'], s['rounded-sm'], s['w-full']), style: { zIndex: 999 }, children: filteredOptions?.length > 0 ? (_jsx("ul", { role: "list", className: cn(s['flex'], s['flex-col'], s['gap-1'], s['bg-gray-200'], s['w-full']), id: "list", ref: listRef, children: filteredOptions?.map((option, index) => {
-                            let className = cn(s['flex'], s['gap-2'], s['p-2']);
-                            if (index === activeOption) {
-                                className = cn(className, s['font-bold']);
-                            }
-                            return (_jsx("li", { className: className, role: "listitem", onClick: onOptionClick, children: option }, index));
-                        }) })) : (_jsx("div", { className: cn(s['flex'], s['bg-gray-200'], s['w-full'], s['p-2']), children: _jsx("span", { children: "Not Found Result!!" }) })) }) })) : (_jsx(_Fragment, {})) }));
-    };
-    useEffect(() => {
-        // this only works on click when inside timeout
-        setTimeout(() => {
-            inputRef.current?.select();
-        }, 0);
-        filteredOptions[0] && onValueChange(filteredOptions[0]);
-        // setShouldShowList(true);
-    }, []);
-    return (_jsx(_Fragment, { children: _jsxs("div", { className: cn(s['flex'], s['flex-col'], s['relative']), children: [_jsx("div", { className: cn(s['flex'], s['leading-4'], s['p-2'], s['focus:outline-none'], s['focus:ring'], s['w-full'], s['shadow-sm'], s['sm:text-base'], s['border'], s['rounded-md']), children: _jsx("input", { type: "text", role: "input", name: "autocomplete-input", className: cn(s['flex'], s['focus:outline-none']), placeholder: "Search...", onChange: onInputChange, onKeyDown: onKeyDown, value: searchValue, ref: inputRef, onClick: () => {
-                            setShouldShowList(true);
-                        } }) }), _jsx("div", { className: cn(s['flex']), children: renderList() })] }) }));
-};

package/lib/src/core-components/molecules/color-picker/color-picker.component.d.ts

@@ -1,6 +0,0 @@
-import './color-picker.css';
-export declare const ColorPicker: ({ color, onChange }: {
-    color: any;
-    onChange: any;
-}) => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=color-picker.component.d.ts.map

package/lib/src/core-components/molecules/color-picker/color-picker.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"color-picker.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/molecules/color-picker/color-picker.component.tsx"],"names":[],"mappings":"AAGA,OAAO,oBAAoB,CAAC;AAE5B,eAAO,MAAM,WAAW;;;6CAqBvB,CAAC"}

package/lib/src/core-components/molecules/color-picker/color-picker.component.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useRef, useState } from 'react';
-import { HexColorPicker } from 'react-colorful';
-import { useClickOutside } from '../../../hooks';
-import './color-picker.css';
-export const ColorPicker = ({ color, onChange }) => {
-    const popover = useRef();
-    const [isOpen, toggle] = useState(false);
-    const close = useCallback(() => toggle(false), []);
-    useClickOutside(popover, close);
-    return (_jsxs("div", { className: "picker", children: [_jsx("div", { className: "swatch", style: { backgroundColor: color }, onClick: () => toggle(true) }), isOpen && (_jsx("div", { className: "popover", ref: popover, children: _jsx(HexColorPicker, { color: color, onChange: onChange }) }))] }));
-};