@lanaco/lnc-react-ui 4.0.80 → 4.0.81

package/dist/CustomLoanMapSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const e=require("react/jsx-runtime"),h=require("react"),C=require("./emotion-styled.browser.esm-BtEseadx.cjs"),T=require("./consts-CtNoHdBj.cjs"),f=require("./index-opywxmcY.cjs"),q=require("./index-BuKj-ITH.cjs"),L=C.styled.div`
+"use strict";const e=require("react/jsx-runtime"),h=require("react"),C=require("./emotion-styled.browser.esm-BtEseadx.cjs"),T=require("./consts-CtNoHdBj.cjs"),f=require("./index-opywxmcY.cjs"),q=require("./index-Dy-o153l.cjs"),L=C.styled.div`
   display: flex;
   gap: 2rem;
 

package/dist/CustomLoanMapSection.js

@@ -3,7 +3,7 @@ import { forwardRef as h } from "react";
 import { s as C } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as L } from "./consts-C1uHV4xc.js";
 import { L as T } from "./index-5F6QsgOG.js";
-import { L as F } from "./index-CcLiL4eM.js";
+import { L as F } from "./index-D0Cl3mpJ.js";
 const M = C.div`
   display: flex;
   gap: 2rem;

package/dist/LoanCalculatorSection.cjs

@@ -1 +1,226 @@
-"use strict";const n=require("react/jsx-runtime"),u=require("react"),s=require("./index-BuKj-ITH.cjs"),i=u.forwardRef((t,e)=>{const{loanCalculatorTitle:o,loanCalculatorText:a,loanCalculatorPlaceholder:l,openCalculatorText:r,onOpenCalculator:c=()=>{}}=t;return n.jsx(s.LoanCalculator,{ref:e,title:o,text:a,openCalculatorText:r,onOpenCalculator:c,placeholderText:l})});module.exports=i;
+"use strict";const e=require("react/jsx-runtime"),i=require("react"),W=require("./index-Dy-o153l.cjs"),D=require("./Modal.cjs"),V=require("./Button.cjs"),F=require("./TextInput.cjs"),K=require("./RangeSlider.cjs"),O=require("./emotion-styled.browser.esm-BtEseadx.cjs"),G=require("./IconButton.cjs"),J=O.styled.div`
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  align-self: stretch;
+  position: relative;
+  margin-bottom: 0.5rem;
+  margin-top: -0.5rem;
+  padding-bottom: 1rem;
+
+  &::after {
+    content: "";
+    position: absolute;
+    left: -1.5rem;
+    right: -1.5rem;
+    bottom: 0;
+    height: 0.0625rem;
+    background: var(--neutral-95008, rgba(20, 22, 26, 0.08));
+    z-index: 1;
+  }
+
+  & .header__title {
+    color: var(--gray-950, #14161a);
+    text-align: center;
+    font-size: 1rem;
+    font-style: normal;
+    font-weight: 500;
+    line-height: 1.5rem;
+    width: 100%;
+  }
+
+  & .header__action {
+    position: absolute;
+    right: 0;
+  }
+`,Q=O.styled.div`
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  align-self: stretch;
+  padding: 0.5rem;
+  border-top: 0.0625rem solid var(--neutral-95008, rgba(20, 22, 26, 0.08));
+
+  & .footer__action {
+    color: var(--gray-950-beta, #14161a);
+    font-size: 0.875rem;
+    font-style: normal;
+    font-weight: 500;
+    line-height: 1.25rem;
+    letter-spacing: -0.0056rem;
+  }
+`,X=O.styled.div`
+  display: flex;
+  align-items: flex-start;
+  gap: 2rem;
+  align-self: stretch;
+  padding-top: 0.5rem;
+
+  & .loan-calculator__right {
+    max-width: 22rem;
+
+    & .loan-calculator__summary {
+      display: flex;
+      padding: 1.25rem;
+      flex-direction: column;
+      align-items: flex-start;
+      gap: 1.25rem;
+      flex: 1 0 0;
+      border-radius: 0.75rem;
+      border: 0.0625rem solid var(--neutral-95008, rgba(20, 22, 26, 0.08));
+      background: var(--neutral-95004, rgba(20, 22, 26, 0.04));
+
+      & .summary__hint {
+        color: var(--gray-600, #676e79);
+        font-size: 0.75rem;
+        font-style: normal;
+        font-weight: 400;
+        line-height: 1rem;
+        letter-spacing: 0.025rem;
+      }
+
+      & .summary__separator {
+        height: 1px;
+        align-self: stretch;
+        background: var(--neutral-95008, rgba(20, 22, 26, 0.08));
+      }
+
+      & .summary__down {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        gap: 0.5rem;
+        align-self: stretch;
+
+        & .summary__title-wrapper {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          align-self: stretch;
+
+          & .summary__title {
+            color: var(--gray-950, #14161a);
+            font-size: 0.875rem;
+            font-style: normal;
+            font-weight: 400;
+            line-height: 1.25rem;
+            letter-spacing: 0.0156rem;
+
+            &.strong {
+              font-weight: 600;
+              letter-spacing: 0.0063rem;
+            }
+          }
+        }
+      }
+
+      & .summary__up {
+        display: flex;
+        flex-direction: column;
+        align-items: flex-start;
+        gap: 8px;
+        align-self: stretch;
+
+        & .summary__title-wrapper {
+          display: flex;
+          flex-direction: column;
+          align-items: flex-start;
+          gap: 0.125rem;
+
+          & .summary__title {
+            color: var(--gray-950, #14161a);
+            font-size: 1rem;
+            font-style: normal;
+            font-weight: 600;
+            line-height: 1.5rem;
+            letter-spacing: 0.0063rem;
+
+            &.large {
+              font-size: 1.375rem;
+              font-style: normal;
+              font-weight: 600;
+              line-height: 1.75rem;
+            }
+          }
+        }
+      }
+    }
+  }
+
+  & .loan-calculator__left {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 2rem;
+
+    & .loan-calculator__submit {
+      width: 100%;
+    }
+
+    & .loan-calculator__range-inputs {
+      display: flex;
+      flex-direction: column;
+      align-items: flex-start;
+      gap: 1.5rem;
+      align-self: stretch;
+
+      & .loan-calculator__range-input {
+        display: flex;
+        flex-direction: column;
+        align-items: flex-start;
+        gap: 1rem;
+        align-self: stretch;
+
+        & .range-input__hint {
+          color: var(--gray-500, #868c98);
+          font-size: 0.75rem;
+          font-style: normal;
+          font-weight: 400;
+          line-height: 1rem;
+          letter-spacing: 0.025rem;
+
+          &.center {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            align-self: stretch;
+          }
+        }
+
+        & .range-input__form-field {
+          display: flex;
+          flex-direction: column;
+          align-items: flex-start;
+          gap: 0.75rem;
+          align-self: stretch;
+
+          & .range-input__label-field {
+            display: flex;
+            align-items: center;
+            align-self: stretch;
+            justify-content: space-between;
+            & .range-input__label {
+              color: var(--gray-950, #14161a);
+              font-size: 0.875rem;
+              font-style: normal;
+              font-weight: 500;
+              line-height: 1.25rem;
+              letter-spacing: -0.0056rem;
+            }
+
+            & .range-input__text {
+              max-width: 100px;
+              width: 100%;
+            }
+          }
+
+          & .range-input__ranger-wrapper {
+            display: flex;
+            flex-direction: column;
+            width: 100%;
+          }
+        }
+      }
+    }
+  }
+`,Y=i.forwardRef(({defaultLoanAmount:a=2e4,defaultInterestRate:n=5,defaultLoanPeriod:o=36,monthlyPayment:x=599,totalInterestPaid:y=21579,currency:r="KM",loanPeriodUnit:c="months",minLoanAmount:d=1,maxLoanAmount:u=3e5,minInterestRate:h=1,maxInterestRate:g=15,isFixedInterestRate:v=!1,minLoanPeriod:_=1,maxLoanPeriod:p=240,loanAmountLabel:j="Loan amount",loanAmountHint:b="Enter the total loan amount you want to borrow.",interestRateLabel:N="Interest rate",interestRateHint:w="Enter the annual interest rate for loan.",loanPeriodLabel:C="Loan period",loanPeriodHint:L="Enter the duration of the loan in months.",submitText:T="Calculate",summaryMonthlyPaymentText:$="Monthly payment",summaryMonthlyPaymentHint:q="Lorem ipsum dolor sit amet consectetur. Eu eu velit faucibus hendrerit egestas aliquam.",summaryTotalPaymentText:R="Total interest paid",summaryTotalPaymentHint:M="Lorem ipsum dolor sit amet consectetur. Sed sed viverra sed lobortis. At eu tellus tristique hac quis.",handleSubmit:S=()=>{}},z)=>{const[f,A]=i.useState(a),[l,P]=i.useState(n),[m,H]=i.useState(o),I=t=>{var s;A(+((s=t==null?void 0:t.target)==null?void 0:s.value))},k=t=>{var s;P(+((s=t==null?void 0:t.target)==null?void 0:s.value))},E=t=>{var s;H(+((s=t==null?void 0:t.target)==null?void 0:s.value))},B=()=>{S({loanAmount:f,interestRate:l,loanPeriod:m})};return e.jsxs(X,{children:[e.jsxs("div",{className:"loan-calculator__left",children:[e.jsxs("div",{className:"loan-calculator__range-inputs",children:[e.jsx("div",{className:"loan-calculator__range-input",children:e.jsxs("div",{className:"range-input__form-field",children:[e.jsxs("div",{className:"range-input__label-field",children:[e.jsx("div",{className:"range-input__label",children:`${j} (${r})`}),e.jsx(F,{value:f,onChange:I,className:"range-input__text"})]}),e.jsxs("div",{className:"range-input__ranger-wrapper",children:[e.jsx(K,{className:"range-input__ranger",defaultValue:f,value:f,min:d,max:u,onChange:I}),e.jsxs("div",{className:"range-input__hint center",children:[e.jsx("div",{children:`${d} ${r}`}),e.jsx("div",{children:`${u} ${r}`})]})]}),e.jsx("div",{className:"range-input__hint",children:b})]})}),e.jsx("div",{className:"loan-calculator__range-input",children:e.jsxs("div",{className:"range-input__form-field",children:[e.jsxs("div",{className:"range-input__label-field",children:[e.jsx("div",{className:"range-input__label",children:`${N} (%)`}),e.jsx(F,{value:l,onChange:k,className:"range-input__text"})]}),e.jsxs("div",{className:"range-input__ranger-wrapper",children:[e.jsx(K,{className:"range-input__ranger",defaultValue:l,value:l,min:h,max:g,disabled:v,onChange:k}),e.jsxs("div",{className:"range-input__hint center",children:[e.jsx("div",{children:`${h} %`}),e.jsx("div",{children:`${g} %`})]})]}),e.jsx("div",{className:"range-input__hint",children:w})]})}),e.jsx("div",{className:"loan-calculator__range-input",children:e.jsxs("div",{className:"range-input__form-field",children:[e.jsxs("div",{className:"range-input__label-field",children:[e.jsx("div",{className:"range-input__label",children:`${C} (${c})`}),e.jsx(F,{value:m,onChange:E,className:"range-input__text"})]}),e.jsxs("div",{className:"range-input__ranger-wrapper",children:[e.jsx(K,{className:"range-input__ranger",defaultValue:m,value:m,min:_,max:p,onChange:E}),e.jsxs("div",{className:"range-input__hint center",children:[e.jsx("div",{children:`${_} ${c}`}),e.jsx("div",{children:`${p} ${c}`})]})]}),e.jsx("div",{className:"range-input__hint",children:L})]})})]}),e.jsx(V,{text:T,className:"loan-calculator__submit",onClick:B})]}),e.jsx("div",{className:"loan-calculator__right",children:e.jsxs("div",{className:"loan-calculator__summary",children:[e.jsxs("div",{className:"summary__up",children:[e.jsxs("div",{className:"summary__title-wrapper",children:[e.jsx("div",{className:"summary__title",children:$}),e.jsx("div",{className:"summary__title large",children:`${x} ${r}`})]}),e.jsx("div",{className:"summary__hint",children:q})]}),e.jsx("div",{className:"summary__separator"}),e.jsxs("div",{className:"summary__down",children:[e.jsxs("div",{className:"summary__title-wrapper",children:[e.jsx("div",{className:"summary__title strong",children:R}),e.jsx("div",{className:"summary__title",children:`${y} ${r}`})]}),e.jsx("div",{className:"summary__hint",children:M})]})]})})]})}),Z=i.forwardRef(({defaultLoanAmount:a=2e4,defaultInterestRate:n=5,defaultLoanPeriod:o=36,monthlyPayment:x=599,totalInterestPaid:y=21579,currency:r="KM",loanPeriodUnit:c="months",minLoanAmount:d=1,maxLoanAmount:u=3e5,minInterestRate:h=1,maxInterestRate:g=15,minLoanPeriod:v=1,maxLoanPeriod:_=240,isFixedInterestRate:p=!1,loanAmountLabel:j="Loan amount",loanAmountHint:b="Enter the total loan amount you want to borrow.",interestRateLabel:N="Interest rate",interestRateHint:w="Enter the annual interest rate for loan.",loanPeriodLabel:C="Loan period",loanPeriodHint:L="Enter the duration of the loan in months.",submitText:T="Calculate",summaryMonthlyPaymentText:$="Monthly payment",summaryMonthlyPaymentHint:q="Lorem ipsum dolor sit amet consectetur. Eu eu velit faucibus hendrerit egestas aliquam.",summaryTotalPaymentText:R="Total interest paid",summaryTotalPaymentHint:M="Lorem ipsum dolor sit amet consectetur. Sed sed viverra sed lobortis. At eu tellus tristique hac quis.",handleSubmit:S=()=>{}},z)=>e.jsx(Y,{defaultLoanAmount:a,defaultInterestRate:n,defaultLoanPeriod:o,monthlyPayment:x,totalInterestPaid:y,currency:r,loanPeriodUnit:c,minLoanAmount:d,maxLoanAmount:u,minInterestRate:h,maxInterestRate:g,isFixedInterestRate:p,minLoanPeriod:v,maxLoanPeriod:_,loanAmountLabel:j,loanAmountHint:b,interestRateLabel:N,interestRateHint:w,loanPeriodLabel:C,loanPeriodHint:L,submitText:T,summaryMonthlyPaymentText:$,summaryMonthlyPaymentHint:q,summaryTotalPaymentText:R,summaryTotalPaymentHint:M,handleSubmit:S})),U=i.forwardRef(({headerTitleText:a="Loan calculator",handleClick:n=()=>{}},o)=>e.jsxs(J,{children:[e.jsx("div",{className:"header__title",children:a}),e.jsx(G,{icon:"times",borderRadius:"curved",btnType:"basic",color:"neutral",size:"small",className:"header__action",onClick:n})]})),ee=i.forwardRef(({footerTitleText:a="Close",handleClick:n=()=>{}},o)=>e.jsx(Q,{children:e.jsx(V,{text:a,btnType:"basic",color:"neutral",onClick:n,className:"footer__action"})})),te=i.forwardRef(({defaultLoanAmount:a=2e4,defaultInterestRate:n=5,defaultLoanPeriod:o=36,monthlyPayment:x=599,totalInterestPaid:y=21579,currency:r="KM",loanPeriodUnit:c="months",minLoanAmount:d=1,maxLoanAmount:u=3e5,minInterestRate:h=1,maxInterestRate:g=15,isFixedInterestRate:v=!1,minLoanPeriod:_=1,maxLoanPeriod:p=240,headerTitleText:j="Loan calculator",footerTitleText:b="Close",loanAmountLabel:N="Loan amount",loanAmountHint:w="Enter the total loan amount you want to borrow.",interestRateLabel:C="Interest rate",interestRateHint:L="Enter the annual interest rate for loan.",loanPeriodLabel:T="Loan period",loanPeriodHint:$="Enter the duration of the loan in months.",submitText:q="Calculate",summaryMonthlyPaymentText:R="Monthly payment",summaryMonthlyPaymentHint:M="Lorem ipsum dolor sit amet consectetur. Eu eu velit faucibus hendrerit egestas aliquam.",summaryTotalPaymentText:S="Total interest paid",summaryTotalPaymentHint:z="Lorem ipsum dolor sit amet consectetur. Sed sed viverra sed lobortis. At eu tellus tristique hac quis.",handleSubmit:f=()=>{},handleCancel:A=()=>{}},l)=>{const P=()=>{var m;(m=l==null?void 0:l.current)==null||m.close(),A()};return e.jsx(D,{ref:l,header:e.jsx(U,{headerTitleText:j,handleClick:P}),footer:e.jsx(ee,{footerTitleText:b,handleClick:P}),showCloseButton:!1,children:e.jsx(Z,{defaultLoanAmount:a,defaultInterestRate:n,defaultLoanPeriod:o,monthlyPayment:x,totalInterestPaid:y,currency:r,loanPeriodUnit:c,minLoanAmount:d,maxLoanAmount:u,minInterestRate:h,maxInterestRate:g,minLoanPeriod:_,maxLoanPeriod:p,isFixedInterestRate:v,loanAmountLabel:N,loanAmountHint:w,interestRateLabel:C,interestRateHint:L,loanPeriodLabel:T,loanPeriodHint:$,submitText:q,summaryMonthlyPaymentText:R,summaryMonthlyPaymentHint:M,summaryTotalPaymentText:S,summaryTotalPaymentHint:z,handleSubmit:f})})}),ae=i.forwardRef((a,n)=>{const{loanCalculatorTitle:o,loanCalculatorText:x,loanCalculatorPlaceholder:y,openCalculatorText:r,onOpenCalculator:c=t=>{},defaultLoanAmount:d,defaultInterestRate:u,defaultLoanPeriod:h,monthlyPayment:g,totalInterestPaid:v,currency:_,loanPeriodUnit:p,minLoanAmount:j,maxLoanAmount:b,minInterestRate:N,maxInterestRate:w,minLoanPeriod:C,maxLoanPeriod:L,headerTitleText:T,footerTitleText:$,loanAmountLabel:q,loanAmountHint:R,interestRateLabel:M,interestRateHint:S,loanPeriodLabel:z,loanPeriodHint:f,submitText:A,summaryMonthlyPaymentText:l,summaryMonthlyPaymentHint:P,summaryTotalPaymentText:m,summaryTotalPaymentHint:H,handleSubmit:I,handleCancel:k}=a,E=i.useRef(),B=t=>{var s;(s=E==null?void 0:E.current)==null||s.open(),c(t)};return e.jsxs(e.Fragment,{children:[e.jsx(W.LoanCalculator,{ref:n,title:o,text:x,openCalculatorText:r,onOpenCalculator:B,placeholderText:y}),e.jsx(te,{ref:E,defaultLoanAmount:d,defaultInterestRate:u,defaultLoanPeriod:h,monthlyPayment:g,totalInterestPaid:v,currency:_,loanPeriodUnit:p,minLoanAmount:j,maxLoanAmount:b,minInterestRate:N,maxInterestRate:w,minLoanPeriod:C,maxLoanPeriod:L,headerTitleText:T,footerTitleText:$,loanAmountLabel:q,loanAmountHint:R,interestRateLabel:M,interestRateHint:S,loanPeriodLabel:z,loanPeriodHint:f,submitText:A,summaryMonthlyPaymentText:l,summaryMonthlyPaymentHint:P,summaryTotalPaymentText:m,summaryTotalPaymentHint:H,handleSubmit:I,handleCancel:k})]})});module.exports=ae;