react-restyle-components 0.2.40 → 0.2.41

package/README.md

@@ -5,8 +5,8 @@ Easy use restyle components
 ## Installation
 
 ```
+npm install react-restyle-components
 yarn add react-restyle-components
-
 ```
 
 ### 📚 Storybook

package/lib/index.d.ts

@@ -1 +1,2 @@
 export * from './src/core-components';
+//# sourceMappingURL=index.d.ts.map

package/lib/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AACA,cAAc,uBAAuB,CAAC"}

package/lib/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-restyle-components",
-  "version": "0.2.39",
+  "version": "0.2.40",
   "private": false,
   "description": "Easy use restyle components",
   "author": {
@@ -16,8 +16,8 @@
   ],
   "scripts": {
     "start": "serve -s ./build",
-    "dev": "DISABLE_ESLINT_PLUGIN=true craco start",
     "serve-webapp": "craco build && craco start",
+    "dev": "DISABLE_ESLINT_PLUGIN=true craco start",
     "build": "rm -rf ./lib && tsc && chmod +x npm-publish.sh && sh ./npm-publish.sh",
     "eject": "react-scripts eject",
     "precommit": "lint-staged --allow-empty",
@@ -41,6 +41,7 @@
     "@mui/material": "^5.15.19",
     "@radix-ui/react-tooltip": "^1.1.5",
     "@react-pdf/renderer": "^4.1.4",
+    "@storybook/addon-styling-webpack": "^1.0.1",
     "@testing-library/jest-dom": "^5.17.0",
     "@testing-library/user-event": "^13.5.0",
     "@types/jest": "^27.5.2",
@@ -76,6 +77,7 @@
     "@storybook/addon-webpack5-compiler-swc": "^1.0.2",
     "@storybook/blocks": "^8.0.6",
     "@storybook/react": "^8.0.6",
+    "@storybook/react-vite": "^8.4.7",
     "@storybook/react-webpack5": "^8.0.6",
     "@storybook/test": "^8.0.6",
     "@svgr/webpack": "^8.1.0",
@@ -87,6 +89,7 @@
     "copyfiles": "^2.4.1",
     "craco-alias": "^3.0.1",
     "css-loader": "^7.1.2",
+    "@vitejs/plugin-react": "^4.2.1",
     "eslint": "^9.14.0",
     "eslint-plugin-storybook": "^0.8.0",
     "gh-pages": "^3.2.3",
@@ -103,9 +106,16 @@
     "style-loader": "^4.0.0",
     "tailwindcss": "^3.4.14",
     "ts-jest": "^29.2.5",
+    "webpack": "^5.72.0",
+    "vite": "^5.0.11",
+    "vite-plugin-css-injected-by-js": "^3.1.1",
+    "vite-plugin-dts": "^2.3.0",
+    "vite-plugin-eslint": "^1.8.1",
+    "vite-plugin-static-copy": "^1.0.0",
+    "vite-plugin-svgr": "^4.2.0",
+    "vite-tsconfig-paths": "^4.2.0",
     "vitest": "^0.31.4",
-    "vitest-dom": "^0.1.0",
-    "webpack": "^5.72.0"
+    "vitest-dom": "^0.1.0"
   },
   "eslintConfig": {
     "extends": [

package/lib/src/core-components/atoms/button/Button.types.d.ts

@@ -23,3 +23,4 @@ export type ToggleButtonProps = Omit<ButtonProps, 'variant'> & {
     /** What variant of button? Defaults to 'brand' */
     variant?: 'brand' | 'accent';
 };
+//# sourceMappingURL=Button.types.d.ts.map

package/lib/src/core-components/atoms/button/Button.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.types.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/button/Button.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,yBAAyB,EAAE,aAAa,EAAC,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAC,SAAS,EAAC,MAAM,kBAAkB,CAAC;AAE3C,MAAM,MAAM,WAAW,GAAG;IACxB,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,+BAA+B;IAC/B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,GAAG;IAC3D,6CAA6C;IAC7C,EAAE,EAAE,MAAM,CAAC;IACX,0CAA0C;IAC1C,SAAS,EAAE,yBAAyB,CAClC,SAAS,GAAG,aAAa,CAAC,iBAAiB,CAAC,CAC7C,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,GAAG;IAC7D,8DAA8D;IAC9D,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gEAAgE;IAChE,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yFAAyF;IACzF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,kDAAkD;IAClD,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;CAC9B,CAAC"}

package/lib/src/core-components/atoms/button/button.component.d.ts

@@ -4,3 +4,4 @@ import { ButtonProps } from './Button.types';
  * It's a `<button>button</button>`. Pass in regular button props such as onClick as well as any of the props defined here.
  */
 export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
+//# sourceMappingURL=button.component.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"button.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/button/button.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAI3C;;GAEG;AACH,eAAO,MAAM,MAAM,uIA0DlB,CAAC"}

package/lib/src/core-components/atoms/button/button.component.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import { Tooltip } from '../tooltip/tooltip.component';
 import s from '../../../tc.module.css';
@@ -10,9 +10,9 @@ export const Button = forwardRef(({ variant = 'solid', tooltip, disabled = false
     const buttonColorClass = variant === 'solid'
         ? cn(s['text-white'], s['bg-[#007BFF]'], s['hover:bg-[#007BFF]'], s['hover:shadow-lg'], s['text-white'])
         : cn(s['dark:text-white'], s['text-black'], s['border'], s['border-gray-400'], s['hover:shadow-lg']);
-    const button = (React.createElement("button", { ref: ref, ...args, className: cn(s['rounded-100px'], s['px-3'], s['py-1'], s['text-md'], buttonColorClass, s['pt-2'], s['pb-2'], s['font-nunitoSansRegular'], disabled ? s['opacity-50'] : s['opacity-100'], className), type: type, disabled: disabled }, children));
+    const button = (_jsx("button", { ref: ref, ...args, className: cn(s['rounded-100px'], s['px-3'], s['py-1'], s['text-md'], buttonColorClass, s['pt-2'], s['pb-2'], s['font-nunitoSansRegular'], disabled ? s['opacity-50'] : s['opacity-100'], className), type: type, disabled: disabled, children: children }));
     if (tooltip) {
-        return React.createElement(Tooltip, { content: tooltip }, button);
+        return _jsx(Tooltip, { content: tooltip, children: button });
     }
     else {
         return button;

package/lib/src/core-components/atoms/button/buttonGroup/buttonGroup.component.d.ts

@@ -1,8 +1,8 @@
-import React from 'react';
 import { ReactNode } from 'react';
 import '../../../../tc.module.css';
 export declare const ButtonGroup: ({ children, orientation, className, }: {
     children: ReactNode;
     orientation?: "horizontal" | "vertical" | undefined;
     className?: string | undefined;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=buttonGroup.component.d.ts.map

package/lib/src/core-components/atoms/button/buttonGroup/buttonGroup.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"buttonGroup.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/atoms/button/buttonGroup/buttonGroup.component.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAChC,OAAO,2BAA2B,CAAC;AAEnC,eAAO,MAAM,WAAW;cAKZ,SAAS;;;6CASpB,CAAC"}

package/lib/src/core-components/atoms/button/buttonGroup/buttonGroup.component.js

@@ -1,3 +1,3 @@
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import '../../../../tc.module.css';
-export const ButtonGroup = ({ children, orientation = 'horizontal', className, }) => (React.createElement("div", { className: `flex ${orientation == 'horizontal' ? 'flex-row' : 'flex-col'} w-fit gap-2 ${className}` }, children));
+export const ButtonGroup = ({ children, orientation = 'horizontal', className, }) => (_jsx("div", { className: `flex ${orientation == 'horizontal' ? 'flex-row' : 'flex-col'} w-fit gap-2 ${className}`, children: children }));

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

@@ -1,4 +1,3 @@
-import React from 'react';
 import '../../../tc.module.css';
 interface CheckBoxProps {
     title: string;
@@ -7,5 +6,6 @@ interface CheckBoxProps {
     disable?: boolean;
     onChange: (items: any) => void;
 }
-export declare const CheckBox: ({ title, data, className, onChange, }: CheckBoxProps) => React.JSX.Element;
+export declare const CheckBox: ({ title, data, className, onChange, }: CheckBoxProps) => import("react/jsx-runtime").JSX.Element;
 export {};
+//# sourceMappingURL=checkBox.component.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"checkBox.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/check-box/checkBox.component.tsx"],"names":[],"mappings":"AACA,OAAO,wBAAwB,CAAC;AAMhC,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,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;CAChC;AAED,eAAO,MAAM,QAAQ,0CAKlB,aAAa,4CAqCf,CAAC"}

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

@@ -1,20 +1,21 @@
-import React, { useState } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
 import '../../../tc.module.css';
 import { UnCheckbox, CheckedBox } from '../../../library/assets/svg';
+// import UnCheckbox from '../../../library/assets/svg/UnCheckbox.svg?react';
+// import CheckedBox from '../../../library/assets/svg/CheckedBox.svg?react';
 import { InputWrapper } from '../form/form.component';
 export const CheckBox = ({ title = 'Banks', data = [{ title: 'SBI Bank', checked: false }], className, onChange, }) => {
     const [list, setList] = useState(data);
     const width = 20;
-    return (React.createElement(InputWrapper, { label: title }, list?.map((item, index) => (React.createElement("div", { className: `${className} flex flex-row  items-center `, 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));
-        }, key: index },
-        React.createElement("div", { className: "flex mt-1" }, item.checked ? (React.createElement(CheckedBox, { width: width, height: width, fill: "#E7503D", stroke: "E7503D" })) : (React.createElement(UnCheckbox, { width: width, height: width }))),
-        React.createElement("span", null, item?.title))))));
+    return (_jsx(InputWrapper, { label: title, children: list?.map((item, index) => (_jsxs("div", { className: `${className} flex flex-row  items-center `, 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: "flex mt-1", children: item.checked ? (_jsx(CheckedBox, { width: width, height: width, fill: "#E7503D", stroke: "E7503D" })) : (_jsx(UnCheckbox, { width: width, height: width })) }), _jsx("span", { children: item?.title })] }, index))) }));
 };

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

@@ -1,4 +1,3 @@
-import React from 'react';
 import '../../../tc.module.css';
 import 'react-datepicker/dist/react-datepicker.css';
 interface DatePickerProps {
@@ -9,5 +8,6 @@ interface DatePickerProps {
     showFormat?: string;
     placeholder?: string;
 }
-export declare const DatePickerComp: ({ title, className, disable, value, showFormat, placeholder, }: DatePickerProps) => React.JSX.Element;
+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/atoms/date-picker/date-picker.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-picker.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/date-picker/date-picker.component.tsx"],"names":[],"mappings":"AACA,OAAO,wBAAwB,CAAC;AAEhC,OAAO,4CAA4C,CAAC;AAKpD,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,4CAoCjB,CAAC"}

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

@@ -1,4 +1,5 @@
-import React, { useState, forwardRef } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, forwardRef } from 'react';
 import '../../../tc.module.css';
 import DatePicker from 'react-datepicker';
 import 'react-datepicker/dist/react-datepicker.css';
@@ -8,15 +9,11 @@ import { InputWrapper } from '../form/form.component';
 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 (React.createElement("div", { onClick: !disable && props.onClick, ref: ref, className: " border-gray-light place-items-center  border rounded-md px-2 flex " },
-            React.createElement("label", { className: "mr-3 font-arimaRegular text-primaryCharcoal text-lg" }, props.value || props.placeholder),
-            React.createElement(DatePickerSvg, { width: 15, height: 15 })));
+        return (_jsxs("div", { onClick: !disable && props.onClick, ref: ref, className: " border-gray-light place-items-center  border rounded-md px-2 flex ", children: [_jsx("label", { className: "mr-3 font-arimaRegular text-primaryCharcoal text-lg", children: props.value || props.placeholder }), _jsx(DatePickerSvg, { width: 15, height: 15 })] }));
     });
     CustomInput.displayName = 'CustomInput';
     const handleChanges = (date) => {
         setPickedDate(date);
     };
-    return (React.createElement(InputWrapper, { label: title },
-        React.createElement("div", { className: `${className} flex zIndex-999` },
-            React.createElement(DatePicker, { selected: pickedDate || new Date(), dateFormat: showFormat, placeholder: placeholder, onChange: handleChanges, customInput: React.createElement(CustomInput, null) }))));
+    return (_jsx(InputWrapper, { label: title, children: _jsx("div", { className: `${className} flex zIndex-999`, children: _jsx(DatePicker, { selected: pickedDate || new Date(), dateFormat: showFormat, placeholder: placeholder, onChange: handleChanges, customInput: _jsx(CustomInput, {}) }) }) }));
 };

package/lib/src/core-components/atoms/form/form.component.d.ts

@@ -45,7 +45,7 @@ export declare const Input: React.ForwardRefExoticComponent<Omit<InputProps, "re
 export declare const InputPassword: React.ForwardRefExoticComponent<Omit<InputProps, "ref"> & React.RefAttributes<any>>;
 export declare const Input1: React.ForwardRefExoticComponent<Omit<InputProps, "ref"> & React.RefAttributes<any>>;
 export declare const Input2: React.ForwardRefExoticComponent<Omit<InputProps, "ref"> & React.RefAttributes<any>>;
-export declare const MultilineInput: (props: InputProps) => React.JSX.Element;
+export declare const MultilineInput: (props: InputProps) => import("react/jsx-runtime").JSX.Element;
 interface InputRadioProps extends InputWrapperProps {
     values?: any[];
     value?: string;
@@ -55,7 +55,7 @@ interface InputRadioProps extends InputWrapperProps {
     labelStyle?: any;
     onChange?: (e: any) => void;
 }
-export declare const InputRadio: (props: InputRadioProps) => React.JSX.Element;
+export declare const InputRadio: (props: InputRadioProps) => import("react/jsx-runtime").JSX.Element;
 interface InputDateProps extends InputWrapperProps {
     value?: any;
     name?: string;
@@ -71,8 +71,8 @@ interface InputDateProps extends InputWrapperProps {
     onCalendarToggle?: (status: boolean) => void;
     onFocusRemove?: (date: any) => void;
 }
-export declare const InputDate: ({ name, value, placeholder, use12Hours, label, id, hasError, disabled, format, onChange, onFocusRemove, }: InputDateProps) => React.JSX.Element;
-export declare const CheckBox: (props: any) => React.JSX.Element;
+export declare const InputDate: ({ name, value, placeholder, use12Hours, label, id, hasError, disabled, format, onChange, onFocusRemove, }: InputDateProps) => import("react/jsx-runtime").JSX.Element;
+export declare const CheckBox: (props: any) => import("react/jsx-runtime").JSX.Element;
 interface InputFileProps extends InputWrapperProps {
     value?: any;
     name?: string;
@@ -83,7 +83,7 @@ interface InputFileProps extends InputWrapperProps {
     hasError?: boolean;
     onChange?: (e: any) => void;
 }
-export declare const InputFile: (props: InputFileProps) => React.JSX.Element;
+export declare const InputFile: (props: InputFileProps) => import("react/jsx-runtime").JSX.Element;
 interface ToggleProps extends InputWrapperProps {
     disabled?: boolean;
     isToggleLabel?: boolean;
@@ -95,6 +95,7 @@ interface ToggleProps extends InputWrapperProps {
     onChange?: (e: boolean) => void;
     style?: any;
 }
-export declare const Toggle: (props: ToggleProps) => React.JSX.Element;
-export declare const DeliveryScheduleToggle: (props: ToggleProps) => React.JSX.Element;
+export declare const Toggle: (props: ToggleProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DeliveryScheduleToggle: (props: ToggleProps) => import("react/jsx-runtime").JSX.Element;
 export {};
+//# sourceMappingURL=form.component.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"form.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/form/form.component.tsx"],"names":[],"mappings":"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"}

package/lib/src/core-components/atoms/form/form.component.js

@@ -1,12 +1,9 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { useState, useEffect } from 'react';
 import classNames from 'classnames';
 import '../../../tc.module.css';
-export const Label = (props) => (React.createElement(React.Fragment, null,
-    React.createElement("label", { htmlFor: props.htmlFor, className: `${props.hasError ? 'text-red-400' : 'text-current'} block text-3xs font-medium  mb-1`, style: { ...props.style } }, props.children)));
-export const InputWrapper = (props) => (React.createElement("div", { className: props.className, ref: props.ref },
-    React.createElement(Label, { htmlFor: props.id || '', hasError: props.hasError, style: { ...props.style } },
-        React.createElement("span", { className: "dark:text-white w-10" }, props.label)),
-    props.children));
+export const Label = (props) => (_jsx(_Fragment, { children: _jsx("label", { htmlFor: props.htmlFor, className: `${props.hasError ? 'text-red-400' : 'text-current'} block text-3xs font-medium  mb-1`, style: { ...props.style }, children: props.children }) }));
+export const InputWrapper = (props) => (_jsxs("div", { className: props.className, ref: props.ref, children: [_jsx(Label, { htmlFor: props.id || '', hasError: props.hasError, style: { ...props.style }, children: _jsx("span", { className: "dark:text-white w-10", children: props.label }) }), props.children] }));
 export const Input = React.forwardRef((props, ref) => {
     const handleKeyPress = (e) => {
         const key = e.key;
@@ -15,8 +12,7 @@ export const Input = React.forwardRef((props, ref) => {
             e.preventDefault();
         }
     };
-    return (React.createElement(InputWrapper, { label: props.label, id: props.id, hasError: props.hasError, style: props.wrapperStyle, className: props.labelClassName },
-        React.createElement("input", { type: props.type || 'text', id: props.id, ref: props.inputRef, "data-testid": "INPT", autoFocus: props?.isAutoFocus || false, name: props.name, style: props.style, defaultValue: props.defaultValue, placeholder: props.placeholder, required: props.required || false, disabled: props.disabled || false, autoComplete: "given-name", maxLength: props.maxLength, value: props.value, onChange: (e) => props.onChange && props.onChange(e.target.value), onKeyPress: (e) => handleKeyPress(e), className: `${props.className} leading-4 p-2  dark:bg-boxdark  focus:outline-none focus:ring  block w-full shadow-sm sm:text-base  border-2  ${props.hasError ? 'border-red ' : 'border-gray-300'} rounded-md `, onBlur: (e) => props.onBlur && props.onBlur(e.target.value), onKeyDown: props.onKeyDown && props.onKeyDown })));
+    return (_jsx(InputWrapper, { label: props.label, id: props.id, hasError: props.hasError, style: props.wrapperStyle, className: props.labelClassName, children: _jsx("input", { type: props.type || 'text', id: props.id, ref: props.inputRef, "data-testid": "INPT", autoFocus: props?.isAutoFocus || false, name: props.name, style: props.style, defaultValue: props.defaultValue, placeholder: props.placeholder, required: props.required || false, disabled: props.disabled || false, autoComplete: "given-name", maxLength: props.maxLength, value: props.value, onChange: (e) => props.onChange && props.onChange(e.target.value), onKeyPress: (e) => handleKeyPress(e), className: `${props.className} leading-4 p-2  dark:bg-boxdark  focus:outline-none focus:ring  block w-full shadow-sm sm:text-base  border-2  ${props.hasError ? 'border-red ' : 'border-gray-300'} rounded-md `, onBlur: (e) => props.onBlur && props.onBlur(e.target.value), onKeyDown: props.onKeyDown && props.onKeyDown }) }));
 });
 export const InputPassword = React.forwardRef((props, ref) => {
     const [showPassword, setShowPassword] = useState(false);
@@ -26,13 +22,9 @@ export const InputPassword = React.forwardRef((props, ref) => {
     const handleMouseUp = () => {
         setShowPassword(false);
     };
-    return (React.createElement(InputWrapper, { label: props.label, id: props.id, hasError: props.hasError, style: props.wrapperStyle, className: props.labelClassName },
-        React.createElement("div", { className: "flex items-center relative" },
-            React.createElement("input", { type: showPassword ? 'text' : 'password', id: props.id, ref: props.inputRef, "data-testid": "INPT", autoFocus: props?.isAutoFocus || false, name: props.name, style: props.style, defaultValue: props.defaultValue, placeholder: props.placeholder, required: props.required || false, disabled: props.disabled || false, autoComplete: "given-name", maxLength: props.maxLength, value: props.value, onChange: (e) => props.onChange && props.onChange(e.target.value), 
-                // onKeyPress={e => handleKeyPress(e)}
-                className: `${props.className} leading-4 p-2  focus:outline-none focus:ring  block w-full shadow-sm sm:text-base  border-2  ${props.hasError ? 'border-red ' : 'border-gray-300'} rounded-md dark:bg-boxdark`, onBlur: (e) => props.onBlur && props.onBlur(e.target.value), onKeyDown: props.onKeyDown && props.onKeyDown }),
-            React.createElement("div", { className: "flex absolute right-3" },
-                React.createElement("svg", { className: "h-6 dark:bg-boxdark", fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 576 512", onMouseDown: handleMouseDown, onMouseUp: handleMouseUp, onMouseLeave: handleMouseUp }, showPassword ? (React.createElement("path", { fill: "currentColor", d: "M320 400c-75.85 0-137.25-58.71-142.9-133.11L72.2 185.82c-13.79 17.3-26.48 35.59-36.72 55.59a32.35 32.35 0 0 0 0 29.19C89.71 376.41 197.07 448 320 448c26.91 0 52.87-4 77.89-10.46L346 397.39a144.13 144.13 0 0 1-26 2.61zm313.82 58.1l-110.55-85.44a331.25 331.25 0 0 0 81.25-102.07 32.35 32.35 0 0 0 0-29.19C550.29 135.59 442.93 64 320 64a308.15 308.15 0 0 0-147.32 37.7L45.46 3.37A16 16 0 0 0 23 6.18L3.37 31.45A16 16 0 0 0 6.18 53.9l588.36 454.73a16 16 0 0 0 22.46-2.81l19.64-25.27a16 16 0 0 0-2.82-22.45zm-183.72-142l-39.3-30.38A94.75 94.75 0 0 0 416 256a94.76 94.76 0 0 0-121.31-92.21A47.65 47.65 0 0 1 304 192a46.64 46.64 0 0 1-1.54 10l-73.61-56.89A142.31 142.31 0 0 1 320 112a143.92 143.92 0 0 1 144 144c0 21.63-5.29 41.79-13.9 60.11z" })) : (React.createElement("path", { fill: "currentColor", d: "M572.52 241.4C518.29 135.59 410.93 64 288 64S57.68 135.64 3.48 241.41a32.35 32.35 0 0 0 0 29.19C57.71 376.41 165.07 448 288 448s230.32-71.64 284.52-177.41a32.35 32.35 0 0 0 0-29.19zM288 400a144 144 0 1 1 144-144 143.93 143.93 0 0 1-144 144zm0-240a95.31 95.31 0 0 0-25.31 3.79 47.85 47.85 0 0 1-66.9 66.9A95.78 95.78 0 1 0 288 160z" })))))));
+    return (_jsx(InputWrapper, { label: props.label, id: props.id, hasError: props.hasError, style: props.wrapperStyle, className: props.labelClassName, children: _jsxs("div", { className: "flex items-center relative", children: [_jsx("input", { type: showPassword ? 'text' : 'password', id: props.id, ref: props.inputRef, "data-testid": "INPT", autoFocus: props?.isAutoFocus || false, name: props.name, style: props.style, defaultValue: props.defaultValue, placeholder: props.placeholder, required: props.required || false, disabled: props.disabled || false, autoComplete: "given-name", maxLength: props.maxLength, value: props.value, onChange: (e) => props.onChange && props.onChange(e.target.value), 
+                    // onKeyPress={e => handleKeyPress(e)}
+                    className: `${props.className} leading-4 p-2  focus:outline-none focus:ring  block w-full shadow-sm sm:text-base  border-2  ${props.hasError ? 'border-red ' : 'border-gray-300'} rounded-md dark:bg-boxdark`, onBlur: (e) => props.onBlur && props.onBlur(e.target.value), onKeyDown: props.onKeyDown && props.onKeyDown }), _jsx("div", { className: "flex absolute right-3", children: _jsx("svg", { className: "h-6 dark:bg-boxdark", fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 576 512", onMouseDown: handleMouseDown, onMouseUp: handleMouseUp, onMouseLeave: handleMouseUp, children: showPassword ? (_jsx("path", { fill: "currentColor", d: "M320 400c-75.85 0-137.25-58.71-142.9-133.11L72.2 185.82c-13.79 17.3-26.48 35.59-36.72 55.59a32.35 32.35 0 0 0 0 29.19C89.71 376.41 197.07 448 320 448c26.91 0 52.87-4 77.89-10.46L346 397.39a144.13 144.13 0 0 1-26 2.61zm313.82 58.1l-110.55-85.44a331.25 331.25 0 0 0 81.25-102.07 32.35 32.35 0 0 0 0-29.19C550.29 135.59 442.93 64 320 64a308.15 308.15 0 0 0-147.32 37.7L45.46 3.37A16 16 0 0 0 23 6.18L3.37 31.45A16 16 0 0 0 6.18 53.9l588.36 454.73a16 16 0 0 0 22.46-2.81l19.64-25.27a16 16 0 0 0-2.82-22.45zm-183.72-142l-39.3-30.38A94.75 94.75 0 0 0 416 256a94.76 94.76 0 0 0-121.31-92.21A47.65 47.65 0 0 1 304 192a46.64 46.64 0 0 1-1.54 10l-73.61-56.89A142.31 142.31 0 0 1 320 112a143.92 143.92 0 0 1 144 144c0 21.63-5.29 41.79-13.9 60.11z" })) : (_jsx("path", { fill: "currentColor", d: "M572.52 241.4C518.29 135.59 410.93 64 288 64S57.68 135.64 3.48 241.41a32.35 32.35 0 0 0 0 29.19C57.71 376.41 165.07 448 288 448s230.32-71.64 284.52-177.41a32.35 32.35 0 0 0 0-29.19zM288 400a144 144 0 1 1 144-144 143.93 143.93 0 0 1-144 144zm0-240a95.31 95.31 0 0 0-25.31 3.79 47.85 47.85 0 0 1-66.9 66.9A95.78 95.78 0 1 0 288 160z" })) }) })] }) }));
 });
 export const Input1 = React.forwardRef((props, ref) => {
     const handleKeyPress = (e) => {
@@ -42,8 +34,7 @@ export const Input1 = React.forwardRef((props, ref) => {
             e.preventDefault();
         }
     };
-    return (React.createElement(InputWrapper, { label: props.label, id: props.id, hasError: props.hasError, style: props.wrapperStyle, className: props.labelClassName },
-        React.createElement("input", { type: props.type || 'text', id: props.id, ref: props.inputRef, "data-testid": "INPT", autoFocus: props?.isAutoFocus || false, name: props.name, style: props.style, defaultValue: props.defaultValue, placeholder: props.placeholder, required: props.required || false, disabled: props.disabled || false, autoComplete: "given-name", maxLength: props.maxLength, value: props.value, onChange: (e) => props.onChange && props.onChange(e.target.value), onKeyPress: (e) => handleKeyPress(e), className: `${props.className} leading-4 p-2  focus:outline-none focus:ring  block w-full shadow-sm sm:text-base  border-2  ${props.hasError ? 'border-red ' : 'border-gray-300'} rounded-md dark:text-black`, onBlur: (e) => props.onBlur && props.onBlur(e), onKeyDown: props.onKeyDown })));
+    return (_jsx(InputWrapper, { label: props.label, id: props.id, hasError: props.hasError, style: props.wrapperStyle, className: props.labelClassName, children: _jsx("input", { type: props.type || 'text', id: props.id, ref: props.inputRef, "data-testid": "INPT", autoFocus: props?.isAutoFocus || false, name: props.name, style: props.style, defaultValue: props.defaultValue, placeholder: props.placeholder, required: props.required || false, disabled: props.disabled || false, autoComplete: "given-name", maxLength: props.maxLength, value: props.value, onChange: (e) => props.onChange && props.onChange(e.target.value), onKeyPress: (e) => handleKeyPress(e), className: `${props.className} leading-4 p-2  focus:outline-none focus:ring  block w-full shadow-sm sm:text-base  border-2  ${props.hasError ? 'border-red ' : 'border-gray-300'} rounded-md dark:text-black`, onBlur: (e) => props.onBlur && props.onBlur(e), onKeyDown: props.onKeyDown }) }));
 });
 export const Input2 = React.forwardRef((props, ref) => {
     const [isBlur, setIsBlur] = useState(true);
@@ -57,8 +48,7 @@ export const Input2 = React.forwardRef((props, ref) => {
     const handleBlur = (value) => {
         props.onBlur && isBlur && props.onBlur(value);
     };
-    return (React.createElement(InputWrapper, { label: props.label, id: props.id, hasError: props.hasError, style: props.wrapperStyle, className: props.labelClassName },
-        React.createElement("input", { type: props.type || 'text', id: props.id, ref: props.inputRef, "data-testid": "INPT", autoFocus: props?.isAutoFocus || false, name: props.name, style: props.style, defaultValue: props.defaultValue, placeholder: props.placeholder, required: props.required || false, disabled: props.disabled || false, autoComplete: "given-name", maxLength: props.maxLength, value: props.value, onChange: (e) => {
+    return (_jsx(InputWrapper, { label: props.label, id: props.id, hasError: props.hasError, style: props.wrapperStyle, className: props.labelClassName, children: _jsx("input", { type: props.type || 'text', id: props.id, ref: props.inputRef, "data-testid": "INPT", autoFocus: props?.isAutoFocus || false, name: props.name, style: props.style, defaultValue: props.defaultValue, placeholder: props.placeholder, required: props.required || false, disabled: props.disabled || false, autoComplete: "given-name", maxLength: props.maxLength, value: props.value, onChange: (e) => {
                 setIsBlur(true);
                 props.onChange && props.onChange(e.target.value);
             }, onKeyPress: (e) => handleKeyPress(e), className: `${props.className} leading-4 p-2  focus:outline-none focus:ring  block w-full shadow-sm sm:text-base  border-2  ${props.hasError ? 'border-red ' : 'border-gray-300'} rounded-md dark:text-black`, onKeyDown: (e) => {
@@ -69,25 +59,17 @@ export const Input2 = React.forwardRef((props, ref) => {
                 props.onKeyDown && props.onKeyDown(e);
             }, onBlur: (e) => {
                 handleBlur(e.target.value);
-            } })));
+            } }) }));
 });
-export const MultilineInput = (props) => (React.createElement(InputWrapper, { label: props.label, id: props.id, className: props.className },
-    React.createElement("textarea", { id: props.id, autoComplete: "given-name", value: props.value, disabled: props.disabled, style: props.style, rows: props.rows, onKeyUp: props.onKeyUp && props.onKeyUp, placeholder: props.placeholder, onChange: (e) => props.onChange && props.onChange(e.target.value), onBlur: (e) => props.onBlur && props.onBlur(e.target.value), className: `leading-4 p-2 focus:outline-none focus:ring block w-full shadow-sm sm:text-base border-2 ${props.hasError ? 'border-red ' : 'border-gray-300'} rounded-md dark:bg-boxdark`, defaultValue: props.defaultValue })));
-export const InputRadio = (props) => (React.createElement(InputWrapper, { label: props.label, id: props.id, style: props.labelStyle }, props.values?.map((item, key) => (React.createElement("div", { className: "flex items-center gap-2", key: key, onClick: () => {
-        props.onChange && props.onChange(item.value);
-    } },
-    React.createElement("input", { key: key, type: "radio", id: props.id, name: props.name, value: item.value, checked: item.value == props.value ? true : false, onChange: () => props.onChange && props.onChange(item.value), className: "w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600" }),
-    React.createElement(Label, { htmlFor: props.id || '', style: { marginTop: 6 } }, item.label))))));
-export const InputDate = ({ name, value, placeholder, use12Hours = true, label, id, hasError, disabled, format, onChange, onFocusRemove, }) => (React.createElement(InputWrapper, { label: label, id: id, hasError: hasError },
-    React.createElement("input", { type: "date", id: id, name: name, disabled: disabled || false, value: value, onChange: (e) => onChange && onChange(e), className: `leading-4 p-2 focus:outline-none focus:ring block w-full shadow-sm sm:text-base border-2 ${hasError ? 'border-red ' : 'border-gray-300'} rounded-md` })));
+export const MultilineInput = (props) => (_jsx(InputWrapper, { label: props.label, id: props.id, className: props.className, children: _jsx("textarea", { id: props.id, autoComplete: "given-name", value: props.value, disabled: props.disabled, style: props.style, rows: props.rows, onKeyUp: props.onKeyUp && props.onKeyUp, placeholder: props.placeholder, onChange: (e) => props.onChange && props.onChange(e.target.value), onBlur: (e) => props.onBlur && props.onBlur(e.target.value), className: `leading-4 p-2 focus:outline-none focus:ring block w-full shadow-sm sm:text-base border-2 ${props.hasError ? 'border-red ' : 'border-gray-300'} rounded-md dark:bg-boxdark`, defaultValue: props.defaultValue }) }));
+export const InputRadio = (props) => (_jsx(InputWrapper, { label: props.label, id: props.id, style: props.labelStyle, children: props.values?.map((item, key) => (_jsxs("div", { className: "flex items-center gap-2", onClick: () => {
+            props.onChange && props.onChange(item.value);
+        }, children: [_jsx("input", { type: "radio", id: props.id, name: props.name, value: item.value, checked: item.value == props.value ? true : false, onChange: () => props.onChange && props.onChange(item.value), className: "w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600" }, key), _jsx(Label, { htmlFor: props.id || '', style: { marginTop: 6 }, children: item.label })] }, key))) }));
+export const InputDate = ({ name, value, placeholder, use12Hours = true, label, id, hasError, disabled, format, onChange, onFocusRemove, }) => (_jsx(InputWrapper, { label: label, id: id, hasError: hasError, children: _jsx("input", { type: "date", id: id, name: name, disabled: disabled || false, value: value, onChange: (e) => onChange && onChange(e), className: `leading-4 p-2 focus:outline-none focus:ring block w-full shadow-sm sm:text-base border-2 ${hasError ? 'border-red ' : 'border-gray-300'} rounded-md` }) }));
 export const CheckBox = (props) => {
-    return (React.createElement("div", null,
-        React.createElement("input", { key: props.id, onClick: props.handleCheckChieldElement, type: "checkbox", checked: props.isChecked, value: props.value }),
-        ' ',
-        props.value));
+    return (_jsxs("div", { children: [_jsx("input", { onClick: props.handleCheckChieldElement, type: "checkbox", checked: props.isChecked, value: props.value }, props.id), ' ', props.value] }));
 };
-export const InputFile = (props) => (React.createElement(InputWrapper, { label: props.label, id: props.id },
-    React.createElement("input", { type: "file", id: props.id, name: props.name, disabled: props.disabled || false, accept: props.accept, value: props.value, onChange: (e) => props.onChange && props.onChange(e), className: `leading-4 p-2 focus:outline-none focus:ring block w-full shadow-sm sm:text-base border-2 ${props.hasError ? 'border-red ' : 'border-gray-300'} rounded-md`, multiple: props.multiple })));
+export const InputFile = (props) => (_jsx(InputWrapper, { label: props.label, id: props.id, children: _jsx("input", { type: "file", id: props.id, name: props.name, disabled: props.disabled || false, accept: props.accept, value: props.value, onChange: (e) => props.onChange && props.onChange(e), className: `leading-4 p-2 focus:outline-none focus:ring block w-full shadow-sm sm:text-base border-2 ${props.hasError ? 'border-red ' : 'border-gray-300'} rounded-md`, multiple: props.multiple }) }));
 export const Toggle = (props) => {
     const [toggle, setToggle] = useState(props.value);
     const { onChange, disabled, className, isToggleLabel = true } = props;
@@ -107,16 +89,8 @@ export const Toggle = (props) => {
         'wrg-toggle--checked': toggle,
         'wrg-toggle--disabled': disabled,
     }, className);
-    return (React.createElement(InputWrapper, { label: props.label, id: props.id, style: props.style },
-        React.createElement("div", { onClick: triggerToggle, className: toggleClasses },
-            React.createElement("div", { className: 'wrg-toggle-container ' +
-                    (toggle ? 'bg-green-700' : 'bg-black dark:bg-white') }, isToggleLabel && (React.createElement(React.Fragment, null,
-                React.createElement("div", { className: "wrg-toggle-check" },
-                    React.createElement("span", { className: "text-white ml-1" }, "Yes")),
-                React.createElement("div", { className: "wrg-toggle-uncheck" },
-                    React.createElement("span", { className: "dark:text-black" }, "No"))))),
-            React.createElement("div", { className: `wrg-toggle-circle  dark:bg-black ${toggle ? 'ml-1' : 'mr-1'}  ` }),
-            React.createElement("input", { type: "checkbox", "aria-label": "Toggle Button", className: "wrg-toggle-input" }))));
+    return (_jsx(InputWrapper, { label: props.label, id: props.id, style: props.style, children: _jsxs("div", { onClick: triggerToggle, className: toggleClasses, children: [_jsx("div", { className: 'wrg-toggle-container ' +
+                        (toggle ? 'bg-green-700' : 'bg-black dark:bg-white'), children: isToggleLabel && (_jsxs(_Fragment, { children: [_jsx("div", { className: "wrg-toggle-check", children: _jsx("span", { className: "text-white ml-1", children: "Yes" }) }), _jsx("div", { className: "wrg-toggle-uncheck", children: _jsx("span", { className: "dark:text-black", children: "No" }) })] })) }), _jsx("div", { className: `wrg-toggle-circle  dark:bg-black ${toggle ? 'ml-1' : 'mr-1'}  ` }), _jsx("input", { type: "checkbox", "aria-label": "Toggle Button", className: "wrg-toggle-input" })] }) }));
 };
 export const DeliveryScheduleToggle = (props) => {
     const [toggle, setToggle] = useState(props.value);
@@ -137,14 +111,6 @@ export const DeliveryScheduleToggle = (props) => {
         'wrg-toggle--checked1': toggle,
         'wrg-toggle--disabled1': disabled,
     }, className);
-    return (React.createElement(InputWrapper, { label: props.label, id: props.id, style: props.style },
-        React.createElement("div", { onClick: triggerToggle, className: toggleClasses },
-            React.createElement("div", { className: 'wrg-toggle-container1 ' +
-                    (toggle ? 'bg-green-700' : 'bg-black dark:bg-white') }, isToggleLabel && (React.createElement(React.Fragment, null,
-                React.createElement("div", { className: "wrg-toggle-check1" },
-                    React.createElement("span", { className: "text-white ml-1" }, "Departments")),
-                React.createElement("div", { className: "wrg-toggle-uncheck1" },
-                    React.createElement("span", { className: "dark:text-black" }, "Patients"))))),
-            React.createElement("div", { className: `wrg-toggle-circle1  dark:bg-black ${toggle ? 'ml-1' : 'mr-1'}  ` }),
-            React.createElement("input", { type: "checkbox", "aria-label": "Toggle Button", className: "wrg-toggle-input1" }))));
+    return (_jsx(InputWrapper, { label: props.label, id: props.id, style: props.style, children: _jsxs("div", { onClick: triggerToggle, className: toggleClasses, children: [_jsx("div", { className: 'wrg-toggle-container1 ' +
+                        (toggle ? 'bg-green-700' : 'bg-black dark:bg-white'), children: isToggleLabel && (_jsxs(_Fragment, { children: [_jsx("div", { className: "wrg-toggle-check1", children: _jsx("span", { className: "text-white ml-1", children: "Departments" }) }), _jsx("div", { className: "wrg-toggle-uncheck1", children: _jsx("span", { className: "dark:text-black", children: "Patients" }) })] })) }), _jsx("div", { className: `wrg-toggle-circle1  dark:bg-black ${toggle ? 'ml-1' : 'mr-1'}  ` }), _jsx("input", { type: "checkbox", "aria-label": "Toggle Button", className: "wrg-toggle-input1" })] }) }));
 };

package/lib/src/core-components/atoms/grid/grid.component.d.ts

@@ -6,3 +6,4 @@ interface GridProps {
 }
 export declare const Grid: React.FunctionComponent<GridProps>;
 export {};
+//# sourceMappingURL=grid.component.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"grid.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/grid/grid.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,wBAAwB,CAAC;AAChC,UAAU,SAAS;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAInD,CAAC"}

package/lib/src/core-components/atoms/grid/grid.component.js

@@ -1,3 +1,3 @@
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import '../../../tc.module.css';
-export const Grid = (props) => (React.createElement("div", { className: `xl:grid sm:inline-block grid-cols-${props.cols || 1} gap-3` }, props.children));
+export const Grid = (props) => (_jsx("div", { className: `xl:grid sm:inline-block grid-cols-${props.cols || 1} gap-3`, children: props.children }));

package/lib/src/core-components/atoms/icons/icons.component.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { IconBaseProps } from 'react-icons/lib';
 import '../../../tc.module.css';
 interface IconProps {
@@ -9,3 +10,4 @@ interface IconProps {
 }
 export declare const Icon: ({ nameIcon, propsIcon, tooltip, isDisable, onClick, }: IconProps) => JSX.Element;
 export {};
+//# sourceMappingURL=icons.component.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"icons.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/icons/icons.component.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAE9C,OAAO,wBAAwB,CAAC;AAEhC,UAAU,SAAS;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAGD,eAAO,MAAM,IAAI,0DAMd,SAAS,KAAG,WA2Cd,CAAC"}

package/lib/src/core-components/atoms/icons/icons.component.js

@@ -1,4 +1,5 @@
-import React, { Suspense } from 'react';
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { Suspense } from 'react';
 import _ from 'lodash';
 import { Tooltip } from '../tooltip/tooltip.component';
 import loadable from '@loadable/component';
@@ -23,14 +24,12 @@ export const Icon = ({ nameIcon, propsIcon, tooltip = '', isDisable = false, onC
             ElementIcon = loadable(() => import('react-icons/fa'), {
                 resolveComponent: (el) => el[nameIcon] != null ? el[nameIcon] : el[Object.keys(el.default)[0]],
             });
-        return (React.createElement("div", { onClick: () => {
+        return (_jsx("div", { onClick: () => {
                 if (!isDisable)
                     onClick && onClick();
-            } }, !_.isEmpty(tooltip) ? (React.createElement(Tooltip, { content: tooltip },
-            React.createElement(ElementIcon, { ...iconProps }))) : (React.createElement(Suspense, { fallback: React.createElement("div", null, "Loading...") },
-            React.createElement(ElementIcon, { ...iconProps })))));
+            }, children: !_.isEmpty(tooltip) ? (_jsx(Tooltip, { content: tooltip, children: _jsx(ElementIcon, { ...iconProps }) })) : (_jsx(Suspense, { fallback: _jsx("div", { children: "Loading..." }), children: _jsx(ElementIcon, { ...iconProps }) })) }));
     }
     catch (error) {
-        return React.createElement(React.Fragment, null);
+        return _jsx(_Fragment, {});
     }
 };

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

@@ -13,3 +13,4 @@ interface PinInputGridProps {
 }
 export declare const InputOtp: React.FC<PinInputGridProps>;
 export {};
+//# sourceMappingURL=input-otp.component.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"input-otp.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/input/input-otp.component.tsx"],"names":[],"mappings":"AACA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAC/C,OAAO,wBAAwB,CAAC;AAEhC,OAAO,wBAAwB,CAAC;AAChC,UAAU,iBAAiB;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;IAE/B,YAAY,EAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACrE;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAyFhD,CAAC"}

package/lib/src/core-components/atoms/input/input-otp.component.js

@@ -1,5 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 /* eslint-disable no-console */
-import React, { useEffect, useRef } from 'react';
+import { useEffect, useRef } from 'react';
 import './input-otp.styles.css';
 import '../../../tc.module.css';
 export const InputOtp = ({ className, pin, onPinChanged, }) => {
@@ -44,18 +45,17 @@ export const InputOtp = ({ className, pin, onPinChanged, }) => {
             onPinChanged(undefined, index);
         }
     };
-    return (React.createElement("div", { className: `${className} relative` },
-        React.createElement("div", { className: "flex space-x-1 bg-background-secondary rounded-lg outline-offset-8" }, Array.from({ length: pinLength }, (_, index) => (React.createElement("input", { "data-testid": "onPinChanged", className: "pt-3 pb-2 block w-full px-0 text-5xl font-extrabold border-b-0 text-orange mt-0 bg-transparent text-center z-20 appearance-none focus:outline-none  font-arimaRegular", onKeyDown: (event) => onKeyDown(event, index), key: index, onMouseUp: () => {
-                if (pin.join('').length <= 0) {
-                    changePinFocus(0);
-                }
-            }, onClick: () => {
-                if (pin.join('').length <= 0) {
-                    onPinChanged(undefined, 0);
-                }
-            }, ref: (el) => {
-                if (el) {
-                    inputRefs.current[index] = el;
-                }
-            }, onChange: (event) => onChange(event, index), value: pin[index] || '' }))))));
+    return (_jsx("div", { className: `${className} relative`, children: _jsx("div", { className: "flex space-x-1 bg-background-secondary rounded-lg outline-offset-8", children: Array.from({ length: pinLength }, (_, index) => (_jsx("input", { "data-testid": "onPinChanged", className: "pt-3 pb-2 block w-full px-0 text-5xl font-extrabold border-b-0 text-orange mt-0 bg-transparent text-center z-20 appearance-none focus:outline-none  font-arimaRegular", onKeyDown: (event) => onKeyDown(event, index), onMouseUp: () => {
+                    if (pin.join('').length <= 0) {
+                        changePinFocus(0);
+                    }
+                }, onClick: () => {
+                    if (pin.join('').length <= 0) {
+                        onPinChanged(undefined, 0);
+                    }
+                }, ref: (el) => {
+                    if (el) {
+                        inputRefs.current[index] = el;
+                    }
+                }, onChange: (event) => onChange(event, index), value: pin[index] || '' }, index))) }) }));
 };

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

@@ -14,3 +14,4 @@ interface PinInputGridProps {
 }
 export declare const InputPin: React.FC<PinInputGridProps>;
 export {};
+//# sourceMappingURL=input-pin.component.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"input-pin.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/input/input-pin.component.tsx"],"names":[],"mappings":"AACA,OAAO,KAAyB,MAAM,OAAO,CAAC;AAC9C,OAAO,oBAAoB,CAAC;AAE5B,OAAO,wBAAwB,CAAC;AAEhC,UAAU,iBAAiB;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;IACtC,YAAY,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAClD;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA+HhD,CAAC"}