@lanaco/lnc-react-ui 4.0.81 → 4.0.83

package/dist/FieldOfInterestsWithTagsCardsSection.js

@@ -1,11 +1,11 @@
 import { jsx as i, jsxs as l } from "react/jsx-runtime";
 import { forwardRef as p } from "react";
 import { s as m } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { t as v, m as y, l as k } from "./utils-DCs-SbIv.js";
-import $ from "./Icon.js";
-import { u as N } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
-import { M as C } from "./consts-C1uHV4xc.js";
-const I = m.div`
+import { t as y, m as b, l as $ } from "./utils-DCs-SbIv.js";
+import N from "./Icon.js";
+import { u as C } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
+import { M as I } from "./consts-C1uHV4xc.js";
+const W = m.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -42,7 +42,7 @@ const I = m.div`
       font-style: normal;
       font-weight: 500;
       line-height: 1.5rem;
-      ${v(2)}
+      ${y(2)}
     }
 
     & .wrapper__description {
@@ -52,7 +52,7 @@ const I = m.div`
       font-weight: 400;
       line-height: 1rem;
       letter-spacing: 0.025rem;
-      ${v(2)}
+      ${y(2)}
     }
   }
 
@@ -65,12 +65,12 @@ const I = m.div`
       }
     }
   }
-`, W = m.div`
+`, F = m.div`
   width: 100%;
   height: 11.625rem;
   border-radius: 0.75rem;
-  background: ${y("-90deg")};
-`, F = m.div`
+  background: ${b("-90deg")};
+`, j = m.div`
   display: flex;
   padding: 0 0.5rem 0 0;
   align-items: center;
@@ -114,30 +114,30 @@ const I = m.div`
       color: var(--white, #fff);
     }
   }
-`, j = m.div`
+`, z = m.div`
   width: 7rem;
   height: 3rem;
   border-radius: 999px;
-  background: ${y("-90deg")};
-`, z = p(({}, r) => /* @__PURE__ */ i(j, {})), O = p(
+  background: ${b("-90deg")};
+`, O = p(({}, r) => /* @__PURE__ */ i(z, {})), A = p(
   ({ name: r, isActive: n, icon: t, onSelectCard: s = () => {
-  } }, f) => /* @__PURE__ */ l(F, { className: n ? "active" : "", onClick: s, children: [
-    /* @__PURE__ */ i($, { icon: t, className: "wrapper__icon" }),
+  } }, f) => /* @__PURE__ */ l(j, { className: n ? "active" : "", onClick: s, children: [
+    /* @__PURE__ */ i(N, { icon: t, className: "wrapper__icon" }),
     /* @__PURE__ */ i("div", { className: "wrapper__text", children: r })
   ] })
-), T = p(
+), M = p(
   ({ image: r, imageComponent: n, name: t, description: s, onSelectCard: f = () => {
-  } }, g) => {
-    const { theme: d } = N();
-    return /* @__PURE__ */ l(I, { theme: d, onClick: f, children: [
-      k(n) ? n : /* @__PURE__ */ i("img", { src: r, className: "wrapper__image" }),
+  } }, u) => {
+    const { theme: d } = C();
+    return /* @__PURE__ */ l(W, { theme: d, onClick: f, children: [
+      $(n) ? n : /* @__PURE__ */ i("img", { src: r, className: "wrapper__image" }),
       /* @__PURE__ */ l("div", { className: "wrapper__content", children: [
         t && /* @__PURE__ */ i("div", { className: "wrapper__title", children: t }),
         s && /* @__PURE__ */ i("div", { className: "wrapper__description", children: s })
       ] })
     ] });
   }
-), M = p(({}, r) => /* @__PURE__ */ i(W, {})), A = m.div`
+), E = p(({}, r) => /* @__PURE__ */ i(F, {})), D = m.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -185,7 +185,7 @@ const I = m.div`
     width: 100%;
   }
 
-  @media (max-width: ${C + "px"}) {
+  @media (max-width: ${I + "px"}) {
     & .wrapper__tags {
       overflow-x: scroll;
       justify-content: flex-start;
@@ -211,68 +211,70 @@ const I = m.div`
       gap: 1rem;
     }
   }
-`, X = p(
+`, Z = p(
   ({
     title: r,
     subtitle: n,
     tags: t = [],
     limitTags: s = 7,
     limitTagsForMobile: f = 7,
-    limit: g = 3,
+    limit: u = 3,
     limitForMobile: d = 2,
-    items: a = [],
-    onSelectTag: c = () => {
+    items: o = [],
+    selectedTag: c,
+    onSelectTag: h = () => {
     },
-    onSelectCard: h = () => {
+    onSelectCard: _ = () => {
     },
-    getImage: b = () => {
+    getImage: k = () => {
     }
-  }, E) => {
-    var x, u;
-    const _ = (e) => {
-      c == null || c(e);
-    }, w = (e) => {
+  }, G) => {
+    var x, v;
+    const w = (e) => {
       h == null || h(e);
+    }, g = (e) => {
+      _ == null || _(e);
     };
     return /* @__PURE__ */ l(
-      A,
+      D,
       {
         limitTags: s,
         limitTagsForMobile: f,
-        limitCards: g,
+        limitCards: u,
         limitCardsForMobile: d,
         children: [
           /* @__PURE__ */ l("div", { className: "wrapper__heading", children: [
             r && /* @__PURE__ */ i("div", { className: "wrapper__title", children: r }),
             n && /* @__PURE__ */ i("div", { className: "wrapper__subtitle", children: n })
           ] }),
-          /* @__PURE__ */ i("div", { className: "wrapper__tags", children: t && (t == null ? void 0 : t.length) > 0 ? t == null ? void 0 : t.map((e, o) => /* @__PURE__ */ i(
-            O,
+          /* @__PURE__ */ i("div", { className: "wrapper__tags", children: t && (t == null ? void 0 : t.length) > 0 ? t == null ? void 0 : t.map((e, a) => /* @__PURE__ */ i(
+            A,
             {
               icon: e == null ? void 0 : e.icon,
               name: e == null ? void 0 : e.name,
-              onSelectCard: () => _ == null ? void 0 : _(e)
+              isActive: (e == null ? void 0 : e.uuid) === (c == null ? void 0 : c.uuid),
+              onSelectCard: () => w == null ? void 0 : w(e)
             },
-            `field-of-interests-with-tags-card-tag__${o + 1}`
-          )) : (x = Array.from("123")) == null ? void 0 : x.map((e, o) => /* @__PURE__ */ i(
-            z,
+            `field-of-interests-with-tags-card-tag__${a + 1}`
+          )) : (x = Array.from("123")) == null ? void 0 : x.map((e, a) => /* @__PURE__ */ i(
+            O,
             {},
-            `field-of-interests-with-tags-card-tag-skeleton__${o + 1}`
+            `field-of-interests-with-tags-card-tag-skeleton__${a + 1}`
           )) }),
-          /* @__PURE__ */ i("div", { className: "wrapper__cards", children: a && (a == null ? void 0 : a.length) > 0 ? a == null ? void 0 : a.map((e, o) => /* @__PURE__ */ i(
-            T,
+          /* @__PURE__ */ i("div", { className: "wrapper__cards", children: o && (o == null ? void 0 : o.length) > 0 ? o == null ? void 0 : o.map((e, a) => /* @__PURE__ */ i(
+            M,
             {
-              image: b(e == null ? void 0 : e.image, e == null ? void 0 : e.uuid, e == null ? void 0 : e.sellerUuid),
+              image: k(e == null ? void 0 : e.image, e == null ? void 0 : e.uuid, e == null ? void 0 : e.sellerUuid),
               imageComponent: e == null ? void 0 : e.imageComponent,
               name: e == null ? void 0 : e.name,
               description: (e == null ? void 0 : e.shortDescription) || (e == null ? void 0 : e.description),
-              onSelectCard: () => w == null ? void 0 : w(e)
+              onSelectCard: () => g == null ? void 0 : g(e)
             },
-            `field-of-interests-with-tags-card__${o + 1}`
-          )) : (u = Array.from("123")) == null ? void 0 : u.map((e, o) => /* @__PURE__ */ i(
-            M,
+            `field-of-interests-with-tags-card__${a + 1}`
+          )) : (v = Array.from("123")) == null ? void 0 : v.map((e, a) => /* @__PURE__ */ i(
+            E,
             {},
-            `field-of-interests-with-tags-card-skeleton__${o + 1}`
+            `field-of-interests-with-tags-card-skeleton__${a + 1}`
           )) })
         ]
       }
@@ -280,5 +282,5 @@ const I = m.div`
   }
 );
 export {
-  X as default
+  Z as default
 };

package/dist/LoanCalculatorSection.cjs

@@ -223,4 +223,4 @@
       }
     }
   }
-`,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;
+`,Y=i.forwardRef(({defaultLoanAmount:t=2e4,defaultInterestRate:n=5,defaultLoanPeriod:o=36,monthlyPayment:x=599,totalInterestPaid:y=21579,currency:l="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(t),[r,P]=i.useState(n),[m,H]=i.useState(o),I=a=>{var s;A(+((s=a==null?void 0:a.target)==null?void 0:s.value))},k=a=>{var s;P(+((s=a==null?void 0:a.target)==null?void 0:s.value))},E=a=>{var s;H(+((s=a==null?void 0:a.target)==null?void 0:s.value))},B=()=>{S({loanAmount:f,interestRate:r,loanPeriod:m})};return e.jsxs(X,{className:"loan-calculator__modal-content",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} (${l})`}),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} ${l}`}),e.jsx("div",{children:`${u} ${l}`})]})]}),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:r,onChange:k,className:"range-input__text"})]}),e.jsxs("div",{className:"range-input__ranger-wrapper",children:[e.jsx(K,{className:"range-input__ranger",defaultValue:r,value:r,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} ${l}`})]}),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} ${l}`})]}),e.jsx("div",{className:"summary__hint",children:M})]})]})})]})}),Z=i.forwardRef(({defaultLoanAmount:t=2e4,defaultInterestRate:n=5,defaultLoanPeriod:o=36,monthlyPayment:x=599,totalInterestPaid:y=21579,currency:l="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:t,defaultInterestRate:n,defaultLoanPeriod:o,monthlyPayment:x,totalInterestPaid:y,currency:l,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:t="Loan calculator",handleClick:n=()=>{}},o)=>e.jsxs(J,{className:"loan-calculator__modal-header",children:[e.jsx("div",{className:"header__title",children:t}),e.jsx(G,{icon:"times",borderRadius:"curved",btnType:"basic",color:"neutral",size:"small",className:"header__action",onClick:n})]})),ee=i.forwardRef(({footerTitleText:t="Close",handleClick:n=()=>{}},o)=>e.jsx(Q,{className:"loan-calculator__modal-footer",children:e.jsx(V,{text:t,btnType:"basic",color:"neutral",onClick:n,className:"footer__action"})})),ae=i.forwardRef(({defaultLoanAmount:t=2e4,defaultInterestRate:n=5,defaultLoanPeriod:o=36,monthlyPayment:x=599,totalInterestPaid:y=21579,currency:l="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=()=>{}},r)=>{const P=()=>{var m;(m=r==null?void 0:r.current)==null||m.close(),A()};return e.jsx(D,{ref:r,header:e.jsx(U,{headerTitleText:j,handleClick:P}),footer:e.jsx(ee,{footerTitleText:b,handleClick:P}),showCloseButton:!1,className:"loan-calculator__modal",children:e.jsx(Z,{defaultLoanAmount:t,defaultInterestRate:n,defaultLoanPeriod:o,monthlyPayment:x,totalInterestPaid:y,currency:l,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})})}),te=i.forwardRef((t,n)=>{const{loanCalculatorTitle:o,loanCalculatorText:x,loanCalculatorPlaceholder:y,openCalculatorText:l,onOpenCalculator:c=a=>{},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:r,summaryMonthlyPaymentHint:P,summaryTotalPaymentText:m,summaryTotalPaymentHint:H,handleSubmit:I,handleCancel:k}=t,E=i.useRef(),B=a=>{var s;(s=E==null?void 0:E.current)==null||s.open(),c(a)};return e.jsxs(e.Fragment,{children:[e.jsx(W.LoanCalculator,{ref:n,title:o,text:x,openCalculatorText:l,onOpenCalculator:B,placeholderText:y}),e.jsx(ae,{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:r,summaryMonthlyPaymentHint:P,summaryTotalPaymentText:m,summaryTotalPaymentHint:H,handleSubmit:I,handleCancel:k})]})});module.exports=te;

package/dist/LoanCalculatorSection.js

@@ -1,4 +1,4 @@
-import { jsxs as t, jsx as e, Fragment as G } from "react/jsx-runtime";
+import { jsxs as a, jsx as e, Fragment as G } from "react/jsx-runtime";
 import { forwardRef as I, useState as B, useRef as J } from "react";
 import { L as Q } from "./index-D0Cl3mpJ.js";
 import X from "./Modal.js";
@@ -232,10 +232,10 @@ const Z = V.div`
       }
     }
   }
-`, te = I(
+`, ae = I(
   ({
-    defaultLoanAmount: n = 2e4,
-    defaultInterestRate: l = 5,
+    defaultLoanAmount: l = 2e4,
+    defaultInterestRate: n = 5,
     defaultLoanPeriod: s = 36,
     monthlyPayment: v = 599,
     totalInterestPaid: y = 21579,
@@ -246,8 +246,8 @@ const Z = V.div`
     minInterestRate: h = 1,
     maxInterestRate: g = 15,
     isFixedInterestRate: x = !1,
-    minLoanPeriod: p = 1,
-    maxLoanPeriod: _ = 240,
+    minLoanPeriod: _ = 1,
+    maxLoanPeriod: p = 240,
     loanAmountLabel: b = "Loan amount",
     loanAmountHint: N = "Enter the total loan amount you want to borrow.",
     interestRateLabel: C = "Interest rate",
@@ -262,15 +262,15 @@ const Z = V.div`
     handleSubmit: S = () => {
     }
   }, R) => {
-    const [f, k] = B(n), [i, A] = B(l), [m, O] = B(s), H = (a) => {
+    const [f, k] = B(l), [i, A] = B(n), [m, O] = B(s), H = (t) => {
       var o;
-      k(+((o = a == null ? void 0 : a.target) == null ? void 0 : o.value));
-    }, j = (a) => {
+      k(+((o = t == null ? void 0 : t.target) == null ? void 0 : o.value));
+    }, j = (t) => {
       var o;
-      A(+((o = a == null ? void 0 : a.target) == null ? void 0 : o.value));
-    }, q = (a) => {
+      A(+((o = t == null ? void 0 : t.target) == null ? void 0 : o.value));
+    }, q = (t) => {
       var o;
-      O(+((o = a == null ? void 0 : a.target) == null ? void 0 : o.value));
+      O(+((o = t == null ? void 0 : t.target) == null ? void 0 : o.value));
     }, W = () => {
       S({
         loanAmount: f,
@@ -278,11 +278,11 @@ const Z = V.div`
         loanPeriod: m
       });
     };
-    return /* @__PURE__ */ t(ee, { children: [
-      /* @__PURE__ */ t("div", { className: "loan-calculator__left", children: [
-        /* @__PURE__ */ t("div", { className: "loan-calculator__range-inputs", children: [
-          /* @__PURE__ */ e("div", { className: "loan-calculator__range-input", children: /* @__PURE__ */ t("div", { className: "range-input__form-field", children: [
-            /* @__PURE__ */ t("div", { className: "range-input__label-field", children: [
+    return /* @__PURE__ */ a(ee, { className: "loan-calculator__modal-content", children: [
+      /* @__PURE__ */ a("div", { className: "loan-calculator__left", children: [
+        /* @__PURE__ */ a("div", { className: "loan-calculator__range-inputs", children: [
+          /* @__PURE__ */ e("div", { className: "loan-calculator__range-input", children: /* @__PURE__ */ a("div", { className: "range-input__form-field", children: [
+            /* @__PURE__ */ a("div", { className: "range-input__label-field", children: [
               /* @__PURE__ */ e("div", { className: "range-input__label", children: `${b} (${r})` }),
               /* @__PURE__ */ e(
                 F,
@@ -293,7 +293,7 @@ const Z = V.div`
                 }
               )
             ] }),
-            /* @__PURE__ */ t("div", { className: "range-input__ranger-wrapper", children: [
+            /* @__PURE__ */ a("div", { className: "range-input__ranger-wrapper", children: [
               /* @__PURE__ */ e(
                 K,
                 {
@@ -305,15 +305,15 @@ const Z = V.div`
                   onChange: H
                 }
               ),
-              /* @__PURE__ */ t("div", { className: "range-input__hint center", children: [
+              /* @__PURE__ */ a("div", { className: "range-input__hint center", children: [
                 /* @__PURE__ */ e("div", { children: `${d} ${r}` }),
                 /* @__PURE__ */ e("div", { children: `${u} ${r}` })
               ] })
             ] }),
             /* @__PURE__ */ e("div", { className: "range-input__hint", children: N })
           ] }) }),
-          /* @__PURE__ */ e("div", { className: "loan-calculator__range-input", children: /* @__PURE__ */ t("div", { className: "range-input__form-field", children: [
-            /* @__PURE__ */ t("div", { className: "range-input__label-field", children: [
+          /* @__PURE__ */ e("div", { className: "loan-calculator__range-input", children: /* @__PURE__ */ a("div", { className: "range-input__form-field", children: [
+            /* @__PURE__ */ a("div", { className: "range-input__label-field", children: [
               /* @__PURE__ */ e("div", { className: "range-input__label", children: `${C} (%)` }),
               /* @__PURE__ */ e(
                 F,
@@ -324,7 +324,7 @@ const Z = V.div`
                 }
               )
             ] }),
-            /* @__PURE__ */ t("div", { className: "range-input__ranger-wrapper", children: [
+            /* @__PURE__ */ a("div", { className: "range-input__ranger-wrapper", children: [
               /* @__PURE__ */ e(
                 K,
                 {
@@ -337,15 +337,15 @@ const Z = V.div`
                   onChange: j
                 }
               ),
-              /* @__PURE__ */ t("div", { className: "range-input__hint center", children: [
+              /* @__PURE__ */ a("div", { className: "range-input__hint center", children: [
                 /* @__PURE__ */ e("div", { children: `${h} %` }),
                 /* @__PURE__ */ e("div", { children: `${g} %` })
               ] })
             ] }),
             /* @__PURE__ */ e("div", { className: "range-input__hint", children: w })
           ] }) }),
-          /* @__PURE__ */ e("div", { className: "loan-calculator__range-input", children: /* @__PURE__ */ t("div", { className: "range-input__form-field", children: [
-            /* @__PURE__ */ t("div", { className: "range-input__label-field", children: [
+          /* @__PURE__ */ e("div", { className: "loan-calculator__range-input", children: /* @__PURE__ */ a("div", { className: "range-input__form-field", children: [
+            /* @__PURE__ */ a("div", { className: "range-input__label-field", children: [
               /* @__PURE__ */ e("div", { className: "range-input__label", children: `${L} (${c})` }),
               /* @__PURE__ */ e(
                 F,
@@ -356,21 +356,21 @@ const Z = V.div`
                 }
               )
             ] }),
-            /* @__PURE__ */ t("div", { className: "range-input__ranger-wrapper", children: [
+            /* @__PURE__ */ a("div", { className: "range-input__ranger-wrapper", children: [
               /* @__PURE__ */ e(
                 K,
                 {
                   className: "range-input__ranger",
                   defaultValue: m,
                   value: m,
-                  min: p,
-                  max: _,
+                  min: _,
+                  max: p,
                   onChange: q
                 }
               ),
-              /* @__PURE__ */ t("div", { className: "range-input__hint center", children: [
-                /* @__PURE__ */ e("div", { children: `${p} ${c}` }),
-                /* @__PURE__ */ e("div", { children: `${_} ${c}` })
+              /* @__PURE__ */ a("div", { className: "range-input__hint center", children: [
+                /* @__PURE__ */ e("div", { children: `${_} ${c}` }),
+                /* @__PURE__ */ e("div", { children: `${p} ${c}` })
               ] })
             ] }),
             /* @__PURE__ */ e("div", { className: "range-input__hint", children: $ })
@@ -385,17 +385,17 @@ const Z = V.div`
           }
         )
       ] }),
-      /* @__PURE__ */ e("div", { className: "loan-calculator__right", children: /* @__PURE__ */ t("div", { className: "loan-calculator__summary", children: [
-        /* @__PURE__ */ t("div", { className: "summary__up", children: [
-          /* @__PURE__ */ t("div", { className: "summary__title-wrapper", children: [
+      /* @__PURE__ */ e("div", { className: "loan-calculator__right", children: /* @__PURE__ */ a("div", { className: "loan-calculator__summary", children: [
+        /* @__PURE__ */ a("div", { className: "summary__up", children: [
+          /* @__PURE__ */ a("div", { className: "summary__title-wrapper", children: [
             /* @__PURE__ */ e("div", { className: "summary__title", children: M }),
             /* @__PURE__ */ e("div", { className: "summary__title large", children: `${v} ${r}` })
           ] }),
           /* @__PURE__ */ e("div", { className: "summary__hint", children: E })
         ] }),
         /* @__PURE__ */ e("div", { className: "summary__separator" }),
-        /* @__PURE__ */ t("div", { className: "summary__down", children: [
-          /* @__PURE__ */ t("div", { className: "summary__title-wrapper", children: [
+        /* @__PURE__ */ a("div", { className: "summary__down", children: [
+          /* @__PURE__ */ a("div", { className: "summary__title-wrapper", children: [
             /* @__PURE__ */ e("div", { className: "summary__title strong", children: P }),
             /* @__PURE__ */ e("div", { className: "summary__title", children: `${y} ${r}` })
           ] }),
@@ -404,10 +404,10 @@ const Z = V.div`
       ] }) })
     ] });
   }
-), ae = I(
+), te = I(
   ({
-    defaultLoanAmount: n = 2e4,
-    defaultInterestRate: l = 5,
+    defaultLoanAmount: l = 2e4,
+    defaultInterestRate: n = 5,
     defaultLoanPeriod: s = 36,
     monthlyPayment: v = 599,
     totalInterestPaid: y = 21579,
@@ -418,8 +418,8 @@ const Z = V.div`
     minInterestRate: h = 1,
     maxInterestRate: g = 15,
     minLoanPeriod: x = 1,
-    maxLoanPeriod: p = 240,
-    isFixedInterestRate: _ = !1,
+    maxLoanPeriod: _ = 240,
+    isFixedInterestRate: p = !1,
     loanAmountLabel: b = "Loan amount",
     loanAmountHint: N = "Enter the total loan amount you want to borrow.",
     interestRateLabel: C = "Interest rate",
@@ -434,10 +434,10 @@ const Z = V.div`
     handleSubmit: S = () => {
     }
   }, R) => /* @__PURE__ */ e(
-    te,
+    ae,
     {
-      defaultLoanAmount: n,
-      defaultInterestRate: l,
+      defaultLoanAmount: l,
+      defaultInterestRate: n,
       defaultLoanPeriod: s,
       monthlyPayment: v,
       totalInterestPaid: y,
@@ -447,9 +447,9 @@ const Z = V.div`
       maxLoanAmount: u,
       minInterestRate: h,
       maxInterestRate: g,
-      isFixedInterestRate: _,
+      isFixedInterestRate: p,
       minLoanPeriod: x,
-      maxLoanPeriod: p,
+      maxLoanPeriod: _,
       loanAmountLabel: b,
       loanAmountHint: N,
       interestRateLabel: C,
@@ -464,10 +464,10 @@ const Z = V.div`
       handleSubmit: S
     }
   )
-), ne = I(
-  ({ headerTitleText: n = "Loan calculator", handleClick: l = () => {
-  } }, s) => /* @__PURE__ */ t(Z, { children: [
-    /* @__PURE__ */ e("div", { className: "header__title", children: n }),
+), le = I(
+  ({ headerTitleText: l = "Loan calculator", handleClick: n = () => {
+  } }, s) => /* @__PURE__ */ a(Z, { className: "loan-calculator__modal-header", children: [
+    /* @__PURE__ */ e("div", { className: "header__title", children: l }),
     /* @__PURE__ */ e(
       Y,
       {
@@ -477,26 +477,26 @@ const Z = V.div`
         color: "neutral",
         size: "small",
         className: "header__action",
-        onClick: l
+        onClick: n
       }
     )
   ] })
-), le = I(
-  ({ footerTitleText: n = "Close", handleClick: l = () => {
-  } }, s) => /* @__PURE__ */ e(U, { children: /* @__PURE__ */ e(
+), ne = I(
+  ({ footerTitleText: l = "Close", handleClick: n = () => {
+  } }, s) => /* @__PURE__ */ e(U, { className: "loan-calculator__modal-footer", children: /* @__PURE__ */ e(
     D,
     {
-      text: n,
+      text: l,
       btnType: "basic",
       color: "neutral",
-      onClick: l,
+      onClick: n,
       className: "footer__action"
     }
   ) })
 ), re = I(
   ({
-    defaultLoanAmount: n = 2e4,
-    defaultInterestRate: l = 5,
+    defaultLoanAmount: l = 2e4,
+    defaultInterestRate: n = 5,
     defaultLoanPeriod: s = 36,
     monthlyPayment: v = 599,
     totalInterestPaid: y = 21579,
@@ -507,8 +507,8 @@ const Z = V.div`
     minInterestRate: h = 1,
     maxInterestRate: g = 15,
     isFixedInterestRate: x = !1,
-    minLoanPeriod: p = 1,
-    maxLoanPeriod: _ = 240,
+    minLoanPeriod: _ = 1,
+    maxLoanPeriod: p = 240,
     headerTitleText: b = "Loan calculator",
     footerTitleText: N = "Close",
     loanAmountLabel: C = "Loan amount",
@@ -536,25 +536,26 @@ const Z = V.div`
       {
         ref: i,
         header: /* @__PURE__ */ e(
-          ne,
+          le,
           {
             headerTitleText: b,
             handleClick: A
           }
         ),
         footer: /* @__PURE__ */ e(
-          le,
+          ne,
           {
             footerTitleText: N,
             handleClick: A
           }
         ),
         showCloseButton: !1,
+        className: "loan-calculator__modal",
         children: /* @__PURE__ */ e(
-          ae,
+          te,
           {
-            defaultLoanAmount: n,
-            defaultInterestRate: l,
+            defaultLoanAmount: l,
+            defaultInterestRate: n,
             defaultLoanPeriod: s,
             monthlyPayment: v,
             totalInterestPaid: y,
@@ -564,8 +565,8 @@ const Z = V.div`
             maxLoanAmount: u,
             minInterestRate: h,
             maxInterestRate: g,
-            minLoanPeriod: p,
-            maxLoanPeriod: _,
+            minLoanPeriod: _,
+            maxLoanPeriod: p,
             isFixedInterestRate: x,
             loanAmountLabel: C,
             loanAmountHint: w,
@@ -584,21 +585,21 @@ const Z = V.div`
       }
     );
   }
-), pe = I((n, l) => {
+), _e = I((l, n) => {
   const {
     loanCalculatorTitle: s,
     loanCalculatorText: v,
     loanCalculatorPlaceholder: y,
     openCalculatorText: r,
-    onOpenCalculator: c = (a) => {
+    onOpenCalculator: c = (t) => {
     },
     defaultLoanAmount: d,
     defaultInterestRate: u,
     defaultLoanPeriod: h,
     monthlyPayment: g,
     totalInterestPaid: x,
-    currency: p,
-    loanPeriodUnit: _,
+    currency: _,
+    loanPeriodUnit: p,
     minLoanAmount: b,
     maxLoanAmount: N,
     minInterestRate: C,
@@ -620,18 +621,18 @@ const Z = V.div`
     summaryTotalPaymentHint: O,
     handleSubmit: H,
     handleCancel: j
-  } = n, q = J();
-  return /* @__PURE__ */ t(G, { children: [
+  } = l, q = J();
+  return /* @__PURE__ */ a(G, { children: [
     /* @__PURE__ */ e(
       Q,
       {
-        ref: l,
+        ref: n,
         title: s,
         text: v,
         openCalculatorText: r,
-        onOpenCalculator: (a) => {
+        onOpenCalculator: (t) => {
           var o;
-          (o = q == null ? void 0 : q.current) == null || o.open(), c(a);
+          (o = q == null ? void 0 : q.current) == null || o.open(), c(t);
         },
         placeholderText: y
       }
@@ -645,8 +646,8 @@ const Z = V.div`
         defaultLoanPeriod: h,
         monthlyPayment: g,
         totalInterestPaid: x,
-        currency: p,
-        loanPeriodUnit: _,
+        currency: _,
+        loanPeriodUnit: p,
         minLoanAmount: b,
         maxLoanAmount: N,
         minInterestRate: C,
@@ -673,5 +674,5 @@ const Z = V.div`
   ] });
 });
 export {
-  pe as default
+  _e as default
 };