react-restyle-components 0.3.77 → 0.3.81

package/lib/src/core-components/src/components/Input/InputPin/input.styles.css

@@ -1,35 +0,0 @@
-.-z-1 {
-  z-index: -1;
-}
-
-.origin-0 {
-  transform-origin: 0%;
-}
-
-input:focus ~ label,
-input:not(:placeholder-shown) ~ label,
-textarea:focus ~ label,
-textarea:not(:placeholder-shown) ~ label,
-select:focus ~ label,
-select:not([value='']):valid ~ label {
-  /* @apply transform; scale-75; -translate-y-6; */
-  --tw-translate-x: 0;
-  --tw-translate-y: 0;
-  --tw-rotate: 0;
-  --tw-skew-x: 0;
-  --tw-skew-y: 0;
-  transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y))
-    rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))
-    scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-  --tw-scale-x: 0.75;
-  --tw-scale-y: 0.75;
-  --tw-translate-y: -1.5rem;
-}
-
-input:focus ~ label,
-select:focus ~ label {
-  /* @apply text-black; left-0; */
-  --tw-text-opacity: 1;
-  color: '#696969';
-  left: 0px;
-}

package/lib/src/core-components/src/components/check-box/checkBox.component.d.ts

@@ -1,12 +0,0 @@
-interface CheckBoxProps {
-    title: string;
-    data: Array<any>;
-    className?: string;
-    disable?: boolean;
-    fill?: string;
-    stroke?: string;
-    onChange: (items: any) => void;
-}
-export declare const CheckBox: ({ title, data, className, fill, stroke, onChange, }: CheckBoxProps) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=checkBox.component.d.ts.map

package/lib/src/core-components/src/components/check-box/checkBox.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"checkBox.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/check-box/checkBox.component.tsx"],"names":[],"mappings":"AAMA,UAAU,aAAa;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;CAChC;AAED,eAAO,MAAM,QAAQ,wDAOlB,aAAa,4CAoCf,CAAC"}

package/lib/src/core-components/src/components/check-box/checkBox.component.js

@@ -1,20 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
-import s from '../../tc.module.css';
-import { cn } from '../../utils';
-import { InputWrapper } from '../Form/form.component';
-import { Icon } from '..';
-export const CheckBox = ({ title = 'Banks', data = [{ title: 'SBI Bank', checked: false }], className, fill = '#E7503D', stroke = '#E7503D', onChange, }) => {
-    const [list, setList] = useState(data);
-    const width = 20;
-    return (_jsx(InputWrapper, { label: title, children: list?.map((item, index) => (_jsxs("div", { className: `${cn(s.flex, s['flex-row'], s['items-center'])} ${className}`, onClick: () => {
-                const result = list?.map((e, i) => {
-                    if (i === index)
-                        return { ...e, checked: !item.checked };
-                    else
-                        return { ...e };
-                });
-                setList(result);
-                onChange(result?.filter((item) => item.checked));
-            }, children: [_jsx("div", { className: cn(s.flex, s['gap-2']), children: item.checked ? (_jsx(Icon, { nameIcon: "ImCheckboxChecked" })) : (_jsx(Icon, { nameIcon: "ImCheckboxUnchecked" })) }), _jsx("span", { className: cn(s['text-sm'], s['font-medium'], s['ml-2']), children: item?.title })] }, index))) }));
-};

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

@@ -1,12 +0,0 @@
-import 'react-datepicker/dist/react-datepicker.css';
-interface DatePickerProps {
-    title: string;
-    value?: string;
-    className?: string;
-    disable?: boolean;
-    showFormat?: string;
-    placeholder?: string;
-}
-export declare const DatePickerComp: ({ title, className, disable, value, showFormat, placeholder, }: DatePickerProps) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=date-picker.component.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"date-picker.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/date-picker/date-picker.component.tsx"],"names":[],"mappings":"AAEA,OAAO,4CAA4C,CAAC;AAOpD,UAAU,eAAe;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,cAAc,mEAOxB,eAAe,4CAkDjB,CAAC"}

package/lib/src/core-components/src/components/date-picker/date-picker.component.js

@@ -1,20 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, forwardRef } from 'react';
-import DatePicker from 'react-datepicker';
-import 'react-datepicker/dist/react-datepicker.css';
-import { Icon } from '..';
-import dayjs from 'dayjs';
-import { InputWrapper } from '../Form/form.component';
-import s from '../../tc.module.css';
-import { cn } from '../../utils';
-export const DatePickerComp = ({ title = 'Title', className, disable, value, showFormat = 'yyyy-MM-dd', placeholder = 'Select Date', }) => {
-    const [pickedDate, setPickedDate] = useState(value && dayjs(value).toDate());
-    const CustomInput = forwardRef((props, ref) => {
-        return (_jsxs("div", { onClick: !disable && props.onClick, ref: ref, className: cn(s['border-gray-light'], s['place-items-center'], s['border'], s['rounded-md'], s['px-2'], s.flex), children: [_jsx("label", { className: cn(s['mr-3'], s['font-arimaRegular'], s['text-primaryCharcoal'], s['text-lg']), children: props.value || props.placeholder }), _jsx(Icon, { nameIcon: "ImCalendar" })] }));
-    });
-    CustomInput.displayName = 'CustomInput';
-    const handleChanges = (date) => {
-        setPickedDate(date);
-    };
-    return (_jsx(InputWrapper, { label: title, children: _jsx("div", { className: cn(s.flex, s['zIndex-999'], className), children: _jsx(DatePicker, { selected: pickedDate || new Date(), dateFormat: showFormat, placeholder: placeholder, onChange: handleChanges, customInput: _jsx(CustomInput, {}) }) }) }));
-};

package/lib/src/core-components/src/components/input-dropdown/input-dropdown.component.d.ts

@@ -1,10 +0,0 @@
-interface InputDropdownProps {
-    title: string;
-    items: Array<string>;
-    hasError?: boolean;
-    className?: string;
-    onChange?: (item: string) => void;
-}
-export declare const InputDropdown: ({ items, className, hasError, title, onChange, }: InputDropdownProps) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=input-dropdown.component.d.ts.map

package/lib/src/core-components/src/components/input-dropdown/input-dropdown.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"input-dropdown.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/input-dropdown/input-dropdown.component.tsx"],"names":[],"mappings":"AAIA,UAAU,kBAAkB;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC;AAED,eAAO,MAAM,aAAa,qDAMvB,kBAAkB,4CAsIpB,CAAC"}

package/lib/src/core-components/src/components/input-dropdown/input-dropdown.component.js

@@ -1,44 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useEffect, useRef } from 'react';
-import s from '../../tc.module.css';
-import { cn } from '../../utils';
-import { Icon } from '../';
-export const InputDropdown = ({ items, className, hasError, title, onChange, }) => {
-    const [isOpen, setIsOpen] = useState(false);
-    const [value, setValue] = useState('');
-    const [filteredItems, setFilteredItems] = useState(items);
-    const useOutsideAlerter = (ref) => {
-        useEffect(() => {
-            function handleClickOutside(event) {
-                if (ref.current &&
-                    !ref.current.contains(event.target) &&
-                    isOpen &&
-                    isOpen)
-                    setIsOpen(!isOpen);
-            }
-            document.addEventListener('mousedown', handleClickOutside);
-            return () => {
-                document.removeEventListener('mousedown', handleClickOutside);
-            };
-        }, [ref]);
-    };
-    const handleInputChange = (event) => {
-        const inputValue = event.target.value;
-        setValue(inputValue);
-        const filtered = items.filter((item) => item.toLowerCase().includes(inputValue.toLowerCase()));
-        setFilteredItems(filtered);
-        onChange && onChange(inputValue);
-    };
-    const wrapperRef = useRef(null);
-    useOutsideAlerter(wrapperRef);
-    return (_jsxs("div", { className: cn(className, s['relative']), children: [_jsxs("div", { className: cn(s['flex'], s['flex-row'], s['items-center']), children: [_jsx("input", { type: "text", name: "name", placeholder: title, value: value, className: cn(s['pt-3'], s['pb-2'], s['w-full'], s['px-0'], s['mt-0'], s['bg-transparent'], s['border-gray-secondary'], s['border-0'], s['border-b'], s['appearance-none'], s['focus:outline-none'], s['focus:ring-0'], s['font-arimaRegular'], s['text-md']), onClick: () => {
-                            setIsOpen(!isOpen);
-                        }, onChange: handleInputChange }), !isOpen && (_jsx(_Fragment, { children: _jsx(Icon, { nameIcon: "MdKeyboardArrowDown", propsIcon: { size: '24', color: '#000000' }, onClick: () => {
-                                setIsOpen(!isOpen);
-                            } }) })), isOpen && (_jsx(Icon, { nameIcon: "MdKeyboardArrowUp", propsIcon: { size: '24', color: '#000000' }, onClick: () => {
-                            setIsOpen(!isOpen);
-                        } }))] }), isOpen && (_jsx("div", { className: cn(s['z-10'], s['w-full'], s['absolute'], s['text-base'], s['list-none'], s['bg-white'], s['rounded'], s['divide-y'], s['divide-gray-100'], s['shadow'], s['dark:bg-gray-700']), ref: wrapperRef, children: _jsx("ul", { className: s['py-1'], children: filteredItems?.map((item, index) => (_jsx("li", { className: cn(s['block'], s['py-2'], s['px-4'], s['text-md'], s['hover:bg-gray-100'], s['dark:hover:bg-gray-600'], s['dark:text-gray-200'], s['font-arimaRegular']), onClick: () => {
-                            setValue(item);
-                            setIsOpen(!isOpen);
-                        }, children: item }, index))) }) })), hasError && (_jsx("span", { className: cn(s['text-red'], s['text-4xs']), id: "error", children: `${title} is required` }))] }));
-};

package/lib/src/core-components/src/components/radio/radio.component.d.ts

@@ -1,9 +0,0 @@
-interface RadioProps {
-    title: string;
-    data: Array<any>;
-    className?: string;
-    onChange: (item: any) => void;
-}
-export declare const Radio: ({ title, data, className, onChange, }: RadioProps) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=radio.component.d.ts.map

package/lib/src/core-components/src/components/radio/radio.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"radio.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/radio/radio.component.tsx"],"names":[],"mappings":"AAMA,UAAU,UAAU;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,CAAC,IAAI,KAAA,KAAK,IAAI,CAAC;CAC1B;AAED,eAAO,MAAM,KAAK,0CAKf,UAAU,4CAuCZ,CAAC"}

package/lib/src/core-components/src/components/radio/radio.component.js

@@ -1,20 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState } from 'react';
-import { Icon } from '..';
-import { InputWrapper } from '../Form/form.component';
-import s from '../../tc.module.css';
-import { cn } from '../../utils';
-export const Radio = ({ title = 'Source', data = [], className, onChange, }) => {
-    const [list, setList] = useState(data);
-    const width = 20;
-    return (_jsx(_Fragment, { children: _jsx(InputWrapper, { label: title, children: list?.map((item, index) => (_jsx("div", { className: cn(className, s['flex'], s['items-center'], s['mb-1']), onClick: () => {
-                    const result = list?.map((e, i) => {
-                        if (i == index)
-                            return { ...e, checked: true };
-                        else
-                            return { ...e, checked: false };
-                    });
-                    setList(result);
-                    onChange(result?.find((item) => item.checked));
-                }, children: _jsxs("div", { className: cn(s['flex'], s['flex-row'], s['gap-1'], s['items-center']), children: [item.checked ? (_jsx(Icon, { nameIcon: "ImRadioChecked" })) : (_jsx(Icon, { nameIcon: "ImRadioUnchecked" })), _jsx("span", { className: cn(s['text-4xs']), children: item?.title })] }) }, index))) }) }));
-};

package/lib/src/core-components/src/components/text-input-dropdown/text-input-dropdown.component.d.ts

@@ -1,16 +0,0 @@
-import React from 'react';
-interface TextInputDropdownProps {
-    placeholder?: string;
-    items: Array<string>;
-    hasError?: boolean;
-    className?: string;
-    value?: string;
-    defaultValue?: string;
-    onChange?: (item: string) => void;
-    onBlur?: (event: React.FocusEvent<HTMLInputElement> | null, value?: string) => void;
-    disabled?: boolean;
-    allowCustomInput?: boolean;
-}
-export declare const TextInputDropdown: ({ items, className, hasError, placeholder, value: controlledValue, defaultValue, onChange, onBlur, disabled, allowCustomInput, }: TextInputDropdownProps) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=text-input-dropdown.component.d.ts.map

package/lib/src/core-components/src/components/text-input-dropdown/text-input-dropdown.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"text-input-dropdown.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/text-input-dropdown/text-input-dropdown.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAKzD,UAAU,sBAAsB;IAC9B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,MAAM,CAAC,EAAE,CACP,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,gBAAgB,CAAC,GAAG,IAAI,EAChD,KAAK,CAAC,EAAE,MAAM,KACX,IAAI,CAAC;IACV,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,eAAO,MAAM,iBAAiB,qIAW3B,sBAAsB,4CA0PxB,CAAC"}

package/lib/src/core-components/src/components/text-input-dropdown/text-input-dropdown.component.js

@@ -1,91 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useEffect, useRef } from 'react';
-import s from '../../tc.module.css';
-import { cn } from '../../utils';
-import { Icon } from '../';
-export const TextInputDropdown = ({ items, className, hasError, placeholder = 'Select an option', value: controlledValue, defaultValue = '', onChange, onBlur, disabled = false, allowCustomInput = true, }) => {
-    const [isOpen, setIsOpen] = useState(false);
-    const [internalValue, setInternalValue] = useState(defaultValue);
-    const [filteredItems, setFilteredItems] = useState(items);
-    const [isEditing, setIsEditing] = useState(false);
-    // Use controlled value if provided, otherwise use internal state
-    const value = controlledValue !== undefined ? controlledValue : internalValue;
-    const useOutsideAlerter = (ref) => {
-        useEffect(() => {
-            function handleClickOutside(event) {
-                if (ref.current && !ref.current.contains(event.target) && isOpen) {
-                    setIsOpen(false);
-                    setIsEditing(false);
-                }
-            }
-            document.addEventListener('mousedown', handleClickOutside);
-            return () => {
-                document.removeEventListener('mousedown', handleClickOutside);
-            };
-        }, [ref, isOpen]);
-    };
-    // Update filtered items when items prop changes
-    useEffect(() => {
-        setFilteredItems(items);
-    }, [items]);
-    // Filter items based on current input value
-    useEffect(() => {
-        if (isEditing && value) {
-            const filtered = items.filter((item) => item.toLowerCase().includes(value.toLowerCase()));
-            setFilteredItems(filtered);
-        }
-        else {
-            setFilteredItems(items);
-        }
-    }, [value, items, isEditing]);
-    const handleInputChange = (event) => {
-        const inputValue = event.target.value;
-        if (controlledValue === undefined) {
-            setInternalValue(inputValue);
-        }
-        setIsEditing(true);
-        // Filter items based on input
-        const filtered = items.filter((item) => item.toLowerCase().includes(inputValue.toLowerCase()));
-        setFilteredItems(filtered);
-        onChange && onChange(inputValue);
-    };
-    const handleItemSelect = (item) => {
-        if (controlledValue === undefined) {
-            setInternalValue(item);
-        }
-        setIsOpen(false);
-        setIsEditing(false);
-        onChange && onChange(item);
-        if (item)
-            onBlur && onBlur(null, item); // Trigger onBlur when selection changes
-    };
-    const handleInputClick = () => {
-        if (!disabled) {
-            setIsOpen(!isOpen);
-            setIsEditing(true);
-        }
-    };
-    const handleInputFocus = () => {
-        if (!disabled) {
-            setIsEditing(true);
-        }
-    };
-    const handleInputBlur = (event) => {
-        // Small delay to allow item selection to complete
-        setTimeout(() => {
-            setIsEditing(false);
-        }, 150);
-        onBlur && onBlur(event, value);
-    };
-    const wrapperRef = useRef(null);
-    useOutsideAlerter(wrapperRef);
-    return (_jsxs("div", { className: cn(className, s['relative']), children: [_jsxs("div", { className: cn(s['flex'], s['flex-row'], s['items-center'], s['leading-4'], s['p-2'], s['dark:bg-boxdark'], s['focus:outline-none'], s['focus:ring'], s['block'], 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", { type: "text", name: "name", placeholder: placeholder, value: value, disabled: disabled, className: cn(s['w-full'], s['bg-transparent'], s['border-0'], s['appearance-none'], s['focus:outline-none'], s['focus:ring-0'], s['font-arimaRegular'], s['text-md'], disabled && s['cursor-not-allowed'], disabled && s['opacity-50']), onClick: handleInputClick, onChange: allowCustomInput ? handleInputChange : undefined, onFocus: handleInputFocus, onBlur: handleInputBlur, readOnly: !allowCustomInput }), !disabled && (_jsx(Icon, { nameIcon: isOpen ? 'MdKeyboardArrowUp' : 'MdKeyboardArrowDown', propsIcon: { size: '16', color: '#000000' }, onClick: handleInputClick }))] }), isOpen && !disabled && (_jsx("div", { className: cn(s['z-10'], s['w-full'], s['absolute'], s['text-base'], s['list-none'], s['bg-white'], s['rounded'], s['divide-y'], s['divide-gray-100'], s['shadow'], s['dark:bg-gray-700'], s['max-h-60'], s['overflow-y-auto']), ref: wrapperRef, children: _jsxs("ul", { className: s['py-1'], children: [filteredItems.length > 0 ? (filteredItems.map((item, index) => (_jsx("li", { className: cn(s['block'], s['py-2'], s['px-4'], s['text-md'], s['hover:bg-gray-100'], s['dark:hover:bg-gray-600'], s['dark:text-gray-200'], s['font-arimaRegular'], s['cursor-pointer'], 
-                            // Highlight if this item matches current value
-                            value === item && s['bg-blue-50'], value === item && s['text-blue-700']), onClick: () => handleItemSelect(item), children: item }, index)))) : (_jsx("li", { className: cn(s['block'], s['py-2'], s['px-4'], s['text-md'], s['text-gray-500'], s['font-arimaRegular']), children: allowCustomInput ? 'No matches found' : 'No options available' })), allowCustomInput &&
-                            value &&
-                            !items.includes(value) &&
-                            isEditing && (_jsx("li", { className: cn(s['block'], s['py-2'], s['px-4'], s['text-md'], s['hover:bg-gray-100'], s['dark:hover:bg-gray-600'], s['dark:text-gray-200'], s['font-arimaRegular'], s['cursor-pointer'], s['border-t'], s['border-gray-200'], s['bg-green-50'], s['text-green-700']), onClick: () => handleItemSelect(value), children: _jsxs("span", { className: cn(s.flex, s['ml-2'], s['items-center'], s['gap-1']), children: [_jsx(Icon, { nameIcon: "MdAdd", propsIcon: { size: '16', color: '#059669' } }), "\"", value, "\""] }) }))] }) }))] }));
-};