Many resources are needed to download a project. Please understand that we have to compensate our server costs. Thank you in advance.
Project price only 1 $
You can buy this project and download/modify it how often you want.
theme.keycloak.v2.admin.resources.assets.MultiLineInput-6564e881.js.map Maven / Gradle / Ivy
The user inferface to administrate the Keycloak server.
{"version":3,"file":"MultiLineInput-6564e881.js","sources":["../../src/components/multi-line-input/MultiLineInput.tsx"],"sourcesContent":["import {\n Button,\n ButtonVariant,\n InputGroup,\n TextInput,\n TextInputProps,\n} from \"@patternfly/react-core\";\nimport { MinusCircleIcon, PlusCircleIcon } from \"@patternfly/react-icons\";\nimport { Fragment, useEffect, useMemo } from \"react\";\nimport { useFormContext, useWatch } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\n\nfunction stringToMultiline(value?: string): string[] {\n return typeof value === \"string\" ? value.split(\"##\") : [];\n}\n\nfunction toStringValue(formValue: string[]): string {\n return formValue.join(\"##\");\n}\n\nexport type MultiLineInputProps = Omit & {\n name: string;\n addButtonLabel?: string;\n isDisabled?: boolean;\n defaultValue?: string[];\n stringify?: boolean;\n};\n\nexport const MultiLineInput = ({\n name,\n addButtonLabel,\n isDisabled = false,\n defaultValue,\n stringify = false,\n id,\n ...rest\n}: MultiLineInputProps) => {\n const { t } = useTranslation();\n const { register, setValue, control } = useFormContext();\n const value = useWatch({\n name,\n control,\n defaultValue: defaultValue || \"\",\n });\n\n const fields = useMemo(() => {\n let values = stringify ? stringToMultiline(value as string) : value;\n\n values =\n Array.isArray(values) && values.length !== 0\n ? values\n : defaultValue || [\"\"];\n\n return values;\n }, [value]);\n\n const remove = (index: number) => {\n update([...fields.slice(0, index), ...fields.slice(index + 1)]);\n };\n\n const append = () => {\n update([...fields, \"\"]);\n };\n\n const updateValue = (index: number, value: string) => {\n update([...fields.slice(0, index), value, ...fields.slice(index + 1)]);\n };\n\n const update = (values: string[]) => {\n const fieldValue = values.flatMap((field) => field);\n setValue(name, stringify ? toStringValue(fieldValue) : fieldValue, {\n shouldDirty: true,\n });\n };\n\n useEffect(() => {\n register(name);\n }, [register]);\n\n return (\n \n {fields.map((value, index) => (\n
\n \n updateValue(index, value)}\n name={`${name}.${index}.value`}\n value={value}\n isDisabled={isDisabled}\n {...rest}\n />\n remove(index)}\n tabIndex={-1}\n aria-label={t(\"common:remove\")}\n isDisabled={fields.length === 1 || isDisabled}\n >\n \n {index === fields.length - 1 && (\n \n \n ))}\n
