qlu-20-ui-library 1.7.77 → 1.7.78

package/dist/components/InputFieldForm/InputFieldForm.d.ts

@@ -0,0 +1,20 @@
+/// <reference types="react" />
+type InputFieldFormProps = {
+    id?: string;
+    value?: string;
+    type: string;
+    placeholder?: string;
+    disabled?: boolean;
+    style?: object;
+    errorState: boolean;
+    errorMessage: string;
+    props?: object;
+    onChangeHandler: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    name?: string;
+    autoComplete?: string;
+    dataCyInput?: string;
+    dataCyToggle?: string;
+    inputFieldClassname?: string;
+};
+declare const InputFieldForm: ({ id, value, type, placeholder, style, disabled, errorState, props, onChangeHandler, errorMessage, name, autoComplete, dataCyInput, dataCyToggle, inputFieldClassname, }: InputFieldFormProps) => import("react/jsx-runtime").JSX.Element;
+export default InputFieldForm;

package/dist/components/InputFieldForm/index.d.ts

@@ -0,0 +1,2 @@
+import InputFieldForm from "./InputFieldForm";
+export default InputFieldForm;

package/dist/components/index.d.ts

@@ -176,6 +176,7 @@ export { default as CreditUsageChart } from "./CreditUsageChart";
 export { default as CreditManagementDropdownButton } from "./CreditsManagementDropdownButton/CreditsManagementDropdownButton";
 export { default as CreditManagementDropdownItem } from "./CreditsManagementDropdownButton/CreditsManagementDropdownButton/CreditsManagementDropdownItem";
 export { default as CreditManagementDatePicker } from "./CreditsManagementDropdownButton/CreditsManagementDatePicker";
+export { default as InputFieldForm } from "./InputFieldForm";
 export { default as MultiChart } from "./CompanyView/CompanyViewFinancialSummary/MultiChart/";
 export { default as FileUpload } from "./FileUpload";
 export { default as TopNavbar } from "./TopNavbar";

package/dist/types/components/InputFieldForm/InputFieldForm.d.ts

@@ -0,0 +1,20 @@
+/// <reference types="react" />
+type InputFieldFormProps = {
+    id?: string;
+    value?: string;
+    type: string;
+    placeholder?: string;
+    disabled?: boolean;
+    style?: object;
+    errorState: boolean;
+    errorMessage: string;
+    props?: object;
+    onChangeHandler: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    name?: string;
+    autoComplete?: string;
+    dataCyInput?: string;
+    dataCyToggle?: string;
+    inputFieldClassname?: string;
+};
+declare const InputFieldForm: ({ id, value, type, placeholder, style, disabled, errorState, props, onChangeHandler, errorMessage, name, autoComplete, dataCyInput, dataCyToggle, inputFieldClassname, }: InputFieldFormProps) => import("react/jsx-runtime").JSX.Element;
+export default InputFieldForm;

package/dist/types/components/InputFieldForm/InputFieldForm.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import GetSvgIcon from "../GetSvgIcon";
+import styles from "./styles.module.scss";
+import { clsx } from "../../utils";
+const InputFieldForm = ({ id, value, type = "text", placeholder = "", style = {}, disabled = false, errorState = false, props = {}, onChangeHandler, errorMessage = "Something went wrong!", name, autoComplete = "on", dataCyInput, dataCyToggle, inputFieldClassname, }) => {
+    const [showPassword, setShowPassword] = useState(false);
+    const togglePasswordVisibility = () => {
+        setShowPassword((prevShowPassword) => !prevShowPassword);
+    };
+    const inputFieldClass = clsx({
+        [styles.inputFieldGeneric]: true,
+        [styles.errorInputField]: errorState,
+    });
+    return (_jsxs("div", { className: styles.parentInputfield, children: [_jsxs("div", { className: inputFieldClass, children: [_jsx("input", { id: id, type: showPassword ? "text" : type, disabled: disabled, style: style, placeholder: placeholder, value: value, onChange: onChangeHandler, name: name, ...props, autoComplete: autoComplete, "data-cy": dataCyInput, className: inputFieldClassname }), type === "password" && (_jsx("span", { className: styles.passwordToggle, onClick: togglePasswordVisibility, "data-cy": dataCyToggle, children: showPassword ? (_jsx(GetSvgIcon, { iconType: "eye", iconSize: "16" })) : (_jsx(GetSvgIcon, { iconType: "eyeOff", iconSize: "16" })) }))] }), errorState && _jsx("span", { children: errorMessage })] }));
+};
+export default InputFieldForm;

package/dist/types/components/InputFieldForm/index.d.ts

@@ -0,0 +1,2 @@
+import InputFieldForm from "./InputFieldForm";
+export default InputFieldForm;

package/dist/types/components/InputFieldForm/index.js

@@ -0,0 +1,2 @@
+import InputFieldForm from "./InputFieldForm";
+export default InputFieldForm;

package/dist/types/components/index.d.ts

@@ -176,6 +176,7 @@ export { default as CreditUsageChart } from "./CreditUsageChart";
 export { default as CreditManagementDropdownButton } from "./CreditsManagementDropdownButton/CreditsManagementDropdownButton";
 export { default as CreditManagementDropdownItem } from "./CreditsManagementDropdownButton/CreditsManagementDropdownButton/CreditsManagementDropdownItem";
 export { default as CreditManagementDatePicker } from "./CreditsManagementDropdownButton/CreditsManagementDatePicker";
+export { default as InputFieldForm } from "./InputFieldForm";
 export { default as MultiChart } from "./CompanyView/CompanyViewFinancialSummary/MultiChart/";
 export { default as FileUpload } from "./FileUpload";
 export { default as TopNavbar } from "./TopNavbar";

package/dist/types/components/index.js

@@ -176,6 +176,7 @@ export { default as CreditUsageChart } from "./CreditUsageChart";
 export { default as CreditManagementDropdownButton } from "./CreditsManagementDropdownButton/CreditsManagementDropdownButton";
 export { default as CreditManagementDropdownItem } from "./CreditsManagementDropdownButton/CreditsManagementDropdownButton/CreditsManagementDropdownItem";
 export { default as CreditManagementDatePicker } from "./CreditsManagementDropdownButton/CreditsManagementDatePicker";
+export { default as InputFieldForm } from "./InputFieldForm";
 // =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
 // UNUSED
 export { default as MultiChart } from "./CompanyView/CompanyViewFinancialSummary/MultiChart/";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "qlu-20-ui-library",
-  "version": "1.7.77",
+  "version": "1.7.78",
   "type": "module",
   "scripts": {
     "dev": "vite",