{"version":3,"file":"static/js/CalculatedLoanAmount.f74a696a.js","mappings":"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","sources":["components/CalculatedLoanAmount/CalculatedLoanAmount.styled.ts","components/CalculatedLoanAmount/CalculatedLoanAmount.tsx","types/EpiElementDependency.ts","utils/evaluteVisibilityFromDependencies.ts"],"sourcesContent":["import { styled } from \"styled-components\";\n\nimport {\n styleLabelM,\n styleNumber,\n styleHeadingL,\n styleHeadingM,\n} from \"style/components/Typography\";\nimport { MQ } from \"style/mediaQueries\";\n\nexport const Wrapper = styled.div`\n align-items: flex-start;\n display: flex;\n flex-direction: column;\n gap: 0;\n grid-column: col-start 1 / span 2;\n width: 100%;\n\n ${MQ.FROM_M} {\n grid-column: auto / span 6;\n }\n`;\n\nexport const Heading = styled.h2`\n ${styleLabelM}\n`;\n\nexport const LoanAmount = styled.span`\n ${styleHeadingL}\n ${styleNumber}\n`;\n\nexport const InvalidLoanAmount = styled.span`\n ${styleHeadingM}\n`;\n","import React, { ReactElement, useEffect, useState } from \"react\";\nimport { Controller, FieldValues, useFormContext } from \"react-hook-form\";\n\nimport {\n Wrapper,\n Heading,\n InvalidLoanAmount,\n LoanAmount,\n} from \"./CalculatedLoanAmount.styled\";\nimport CalculatedLoanAmountProps from \"./CalculatedLoanAmountProps\";\n\nimport evaluteVisibilityFromDependencies from \"../../utils/evaluteVisibilityFromDependencies\";\n\nconst CalculatedLoanAmount = ({\n label,\n endAdornment,\n validationMessage,\n formActors,\n dependencies,\n control,\n elementName,\n id,\n identifier,\n setValue,\n}: CalculatedLoanAmountProps): ReactElement => {\n const { watch } = useFormContext();\n\n const [loanAmount, setLoanAmount] = useState(0);\n const [values, setValues] = useState();\n const [mortgageProduct, setMortgageProduct] = useState();\n const [buyPrice, setBuyPrice] = useState();\n const [cashDeposit, setCashDeposit] = useState();\n const [loanExceedsLimit, setLoanExceedsLimit] = useState(false);\n const LOAN_THRESHOLD = 0.85;\n\n const visibleFromDependencies =\n dependencies && control\n ? evaluteVisibilityFromDependencies(dependencies, control)\n : true;\n\n useEffect(() => {\n const subscription = watch((value) => {\n setValues(value);\n });\n\n return () => subscription.unsubscribe();\n }, [watch]);\n\n useEffect(() => {\n if (!values) {\n return;\n }\n\n const { salesforceActor } = formActors || {};\n\n if (salesforceActor) {\n const { mortgageProduct, buyPrice, cashDeposit } = salesforceActor;\n\n if (mortgageProduct !== undefined) {\n setMortgageProduct(values[`__field_${mortgageProduct}`]);\n }\n\n if (buyPrice !== undefined) {\n setBuyPrice(values[`__field_${buyPrice}`]);\n }\n\n if (cashDeposit !== undefined) {\n setCashDeposit(values[`__field_${cashDeposit}`]);\n }\n }\n }, [values, formActors]);\n\n useEffect(() => {\n const handler = setTimeout(() => {\n let calculatedLoanAmount = 0;\n\n if (cashDeposit) {\n if (\n (mortgageProduct === \"LoanPromise\" ||\n mortgageProduct === \"Purchase\") &&\n buyPrice\n ) {\n const diff = buyPrice - cashDeposit;\n const maxLoanAllowed = buyPrice * LOAN_THRESHOLD;\n calculatedLoanAmount = diff < 0 ? 0 : diff;\n setLoanExceedsLimit(calculatedLoanAmount > maxLoanAllowed);\n }\n }\n\n setLoanAmount(calculatedLoanAmount);\n }, 500);\n\n return () => clearTimeout(handler);\n }, [buyPrice, cashDeposit, mortgageProduct]);\n\n useEffect(() => {\n setValue &&\n elementName &&\n setValue(elementName, loanAmount > 0 ? loanAmount : \"\");\n }, [loanAmount, elementName, setValue]);\n\n return (\n <>\n {visibleFromDependencies && (\n <>\n \n {label}\n {loanExceedsLimit ? (\n \n {validationMessage}\n \n ) : (\n \n {loanAmount.toLocaleString(\"sv-SE\")}{\" \"}\n {endAdornment}\n \n )}\n \n\n (\n \n )}\n />\n \n )}\n \n );\n};\n\nexport default React.memo(CalculatedLoanAmount);\n","export default interface EpiElementDependency {\n action?: {\n displayName?: string;\n name?: string;\n order?: number;\n clientsideAction?: EpiDependencyAction;\n };\n conditionCombination?: EpiConditionCombination;\n conditions: EpiCondition[];\n}\n\nexport interface EpiCondition {\n fieldName: string;\n operator: EpiConditionOperator;\n fieldValue: string;\n}\n\nexport enum EpiConditionCombination {\n All = \"All\",\n Any = \"Any\",\n}\n\nexport enum EpiDependencyAction {\n Hide = \"hide\",\n Show = \"show\",\n}\n\nexport enum EpiConditionOperator {\n NotApplicable = \"NotApplicable\",\n MatchRegularExpression = \"MatchRegularExpression\",\n Equals = \"Equals\",\n NotEquals = \"NotEquals\",\n Contains = \"Contains\",\n NotContains = \"NotContains\",\n}\n","import { useWatch, Control } from \"react-hook-form\";\n\nimport EpiElementDependency, {\n EpiConditionCombination,\n EpiConditionOperator,\n EpiDependencyAction,\n} from \"types/EpiElementDependency\";\n\nconst evaluateConditionByOperator = (\n operator: EpiConditionOperator,\n targetValue: string | string[],\n conditionValue: string,\n): boolean => {\n if (typeof targetValue === \"undefined\") return false;\n\n if (!Array.isArray(targetValue))\n switch (operator) {\n case EpiConditionOperator.Equals:\n return targetValue === conditionValue;\n case EpiConditionOperator.NotEquals:\n return targetValue !== conditionValue;\n case EpiConditionOperator.Contains:\n return targetValue.includes(conditionValue);\n case EpiConditionOperator.NotContains:\n return !targetValue.includes(conditionValue);\n case EpiConditionOperator.MatchRegularExpression:\n return new RegExp(conditionValue).test(targetValue);\n case EpiConditionOperator.NotApplicable:\n return true;\n default:\n return false;\n }\n else\n switch (operator) {\n case EpiConditionOperator.Equals:\n return targetValue.includes(conditionValue);\n case EpiConditionOperator.NotEquals:\n return !targetValue.includes(conditionValue);\n case EpiConditionOperator.Contains:\n return targetValue.some((value) =>\n value.includes(conditionValue),\n );\n case EpiConditionOperator.NotContains:\n return !targetValue.some((value) =>\n value.includes(conditionValue),\n );\n case EpiConditionOperator.MatchRegularExpression:\n return targetValue.some((value) =>\n new RegExp(conditionValue).test(value),\n );\n case EpiConditionOperator.NotApplicable:\n return true;\n default:\n return false;\n }\n};\n\nconst evaluteVisibleFromDependencies = (\n dependency: EpiElementDependency | undefined,\n control: Control, any>, // eslint-disable-line @typescript-eslint/no-explicit-any\n): boolean => {\n if (dependency && control) {\n const { conditionCombination, action } = dependency;\n const returnValue =\n action?.clientsideAction === EpiDependencyAction.Show;\n\n const conditions = dependency.conditions || [];\n const elementValues = conditions.map(\n (condition) =>\n useWatch({\n control,\n name: condition.fieldName,\n }) || \"\",\n );\n\n if (conditionCombination === EpiConditionCombination.Any)\n return conditions\n .map((condition, index) => {\n const { operator, fieldValue } = condition;\n const elementValue = elementValues[index];\n return evaluateConditionByOperator(\n operator,\n elementValue,\n fieldValue || \"\",\n )\n ? returnValue\n : !returnValue;\n })\n .some(Boolean);\n else\n return conditions.every((condition, index) => {\n const { operator, fieldValue } = condition;\n const elementValue = elementValues[index];\n return evaluateConditionByOperator(\n operator,\n elementValue,\n fieldValue || \"\",\n )\n ? returnValue\n : !returnValue;\n });\n }\n return true;\n};\n\nexport default evaluteVisibleFromDependencies;\n"],"names":["Wrapper","styled","div","withConfig","componentId","MQ","FROM_M","Heading","h2","styleLabelM","LoanAmount","span","styleHeadingL","styleNumber","InvalidLoanAmount","styleHeadingM","CalculatedLoanAmount","label","endAdornment","validationMessage","formActors","dependencies","control","elementName","id","identifier","setValue","watch","useFormContext","loanAmount","setLoanAmount","useState","values","setValues","mortgageProduct","setMortgageProduct","buyPrice","setBuyPrice","cashDeposit","setCashDeposit","loanExceedsLimit","setLoanExceedsLimit","visibleFromDependencies","evaluteVisibilityFromDependencies","useEffect","subscription","value","unsubscribe","salesforceActor","undefined","handler","setTimeout","calculatedLoanAmount","diff","clearTimeout","_jsx","_Fragment","children","_jsxs","toLocaleString","Controller","name","defaultValue","render","field","type","React","EpiConditionCombination","EpiDependencyAction","EpiConditionOperator","evaluateConditionByOperator","operator","targetValue","conditionValue","Array","isArray","Equals","includes","NotEquals","Contains","some","NotContains","MatchRegularExpression","RegExp","test","NotApplicable","evaluteVisibleFromDependencies","dependency","conditionCombination","action","returnValue","clientsideAction","Show","conditions","elementValues","map","condition","useWatch","fieldName","Any","index","fieldValue","elementValue","Boolean","every"],"sourceRoot":""}