diff --git a/modules/dynamic-forms/package.json b/modules/dynamic-forms/package.json index 698326beef9..75e293eb9a0 100644 --- a/modules/dynamic-forms/package.json +++ b/modules/dynamic-forms/package.json @@ -30,7 +30,6 @@ }, "dependencies": { "@oxygen-ui/react": "^1.8.5", - "@oxygen-ui/react-icons": "^1.8.5", "@mui/material": "^5.13.0", "@wso2is/core": "^2.0.33", "@wso2is/validation": "^2.0.3", diff --git a/modules/dynamic-forms/src/components/adapters.tsx b/modules/dynamic-forms/src/components/adapters.tsx index ec95c7b300a..b946d13044b 100644 --- a/modules/dynamic-forms/src/components/adapters.tsx +++ b/modules/dynamic-forms/src/components/adapters.tsx @@ -16,14 +16,11 @@ * under the License. */ -import IconButton from "@mui/material/IconButton"; -import InputAdornment from "@mui/material/InputAdornment"; -import { EyeIcon, EyeSlashIcon } from "@oxygen-ui/react-icons"; import Button from "@oxygen-ui/react/Button"; import TextField, { TextFieldProps as OuiTextFieldProps } from "@oxygen-ui/react/TextField"; import { CopyInputField, DangerButton, LinkButton, PrimaryButton } from "@wso2is/react-components"; import omit from "lodash-es/omit"; -import React, { ReactElement, useState } from "react"; +import React, { ReactElement } from "react"; import { FieldProps, FieldRenderProps } from "react-final-form"; import { Checkbox, @@ -113,7 +110,7 @@ export const PasswordFieldAdapter = (props: FieldRenderProps) childFieldProps, placeholder, fullWidth = true, - input: { name, value, onChange, onBlur, type, ...restInput }, + input: { name, value, onChange, onBlur, ...restInput }, meta, required, parentFormProps, @@ -122,18 +119,13 @@ export const PasswordFieldAdapter = (props: FieldRenderProps) label } = props; - const [ isPasswordVisible, setIsPasswordVisible ] = useState(); - - const handleClickShowPassword = () => { - setIsPasswordVisible(!isPasswordVisible); - }; - const { error, submitError } = meta; const isError = showError({ meta }); return ( ) ? meta?.initial : resolveFieldInitailValue(meta, name, parentFormProps?.values) } { ...omit(childFieldProps, [ "value", "listen" ]) } - inputProps={ { - required, - type: isPasswordVisible ? "text" : type, - ...restInput } } + inputProps={ { required, ...restInput } } error={ ((meta.error || meta.submitError) && meta.touched) ? meta.error || meta.submitError : null } - InputProps={ { - endAdornment: ( - - - { isPasswordVisible ? : } - - - ) - } } /> ); }; diff --git a/modules/dynamic-forms/src/components/dynamic-form.scss b/modules/dynamic-forms/src/components/dynamic-form.scss index 665b0ba67b8..907e111fc65 100644 --- a/modules/dynamic-forms/src/components/dynamic-form.scss +++ b/modules/dynamic-forms/src/components/dynamic-form.scss @@ -20,7 +20,6 @@ .MuiOutlinedInput-root { border-radius: 8px; font-family: Gilmer; - padding-right: 0; }; .MuiOutlinedInput-input { diff --git a/modules/dynamic-forms/src/components/field-input.tsx b/modules/dynamic-forms/src/components/field-input.tsx index e7e03651b76..1bc6acff364 100644 --- a/modules/dynamic-forms/src/components/field-input.tsx +++ b/modules/dynamic-forms/src/components/field-input.tsx @@ -1,10 +1,19 @@ /** - * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). All Rights Reserved. + * Copyright (c) 2023-2024, WSO2 LLC. (https://www.wso2.com). * - * This software is the property of WSO2 LLC. and its suppliers, if any. - * Dissemination of any information or reproduction of any material contained - * herein in any form is strictly forbidden, unless permitted by WSO2 expressly. - * You may not alter or remove any copyright or other notice from copies of this content. + * WSO2 LLC. licenses this file to you under the Apache License, + * Version 2.0 (the "License"); you may not use this file except + * in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. */ import FormGroup from "@oxygen-ui/react/FormGroup"; @@ -13,19 +22,19 @@ import { Hint } from "@wso2is/react-components"; import { FieldState } from "final-form"; import React, { ReactElement } from "react"; import { FieldProps, Field as FinalFormField } from "react-final-form"; -import { - CopyFieldAdapter, - PasswordFieldAdapter, - QueryParamsAdapter, - ScopeFieldAdapter, - TextFieldAdapter +import { + CopyFieldAdapter, + PasswordFieldAdapter, + QueryParamsAdapter, + ScopeFieldAdapter, + TextFieldAdapter } from "./adapters"; import { DynamicFieldInputTypes, FieldInputTypes } from "../models"; import { getValidation } from "../utils/validate"; -export interface FieldInputPropsInterface extends Omit, "component">, +export interface FieldInputPropsInterface extends Omit, "component">, IdentifiableComponentInterface, TestableComponentInterface { - + /** * Name of the input field. */ @@ -107,9 +116,13 @@ export const FieldInput = (props: FieldInputPropsInterface): ReactElement => { return ( ( - - ) } + render={ ( { input, meta } ) => { + delete input.type; + + return ( + + ); + } } validate={ (value: any, allValues: Record, meta: FieldState) => getValidation(value, allValues, meta, props.required, validation) } diff --git a/modules/dynamic-forms/src/components/utils.tsx b/modules/dynamic-forms/src/components/utils.tsx index 56487564000..37838b9ba08 100644 --- a/modules/dynamic-forms/src/components/utils.tsx +++ b/modules/dynamic-forms/src/components/utils.tsx @@ -73,7 +73,6 @@ export const renderFormFields = (fields: Record): ReactElement => { key={ index } name={ fieldProps.name } label={ fieldProps.label } - type={ fieldProps.type } inputType={ fieldProps.type } { ...fieldProps } /> diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 35fcf125499..ed963e692a8 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1383,9 +1383,6 @@ importers: '@oxygen-ui/react': specifier: ^1.8.5 version: 1.8.5(@emotion/react@11.11.0)(@emotion/styled@11.11.0)(@mui/icons-material@5.11.16)(@mui/lab@5.0.0-alpha.110)(@mui/material@5.13.0)(@mui/system@5.12.3)(@mui/utils@5.14.10)(@types/react@18.0.18)(react-dom@18.2.0)(react@18.2.0)(typescript@4.8.2) - '@oxygen-ui/react-icons': - specifier: ^1.8.5 - version: 1.9.0(react-dom@18.2.0)(react@18.2.0)(typescript@4.8.2) '@wso2is/core': specifier: ^2.0.33 version: link:../core