https://www.spiris.se/dist/js/hourly-rate-calculator.fb3d3348e0cce86d509a.bundle.js

1"use strict";(self.webpackChunkvismaspcscore=self.webpackChunkvismaspcscore||[]).push([[696],{3961:function(e,a,t){t.r(a),t.d(a,{HourlyRateCalculator:function(){return d}});var l=t(6540),s=t(9073),n=t(4498),r=t(5028),o=t(2309),i=t(2732);const c=220,u=2e3;var m=t(4848);function d(e){const a=(0,l.useRef)(null),t=(0,l.useRef)(null),d=(0,l.useRef)(null),b=(0,l.useRef)(null),p=(0,l.useRef)(null),x=(0,l.useRef)(null),f=(0,l.useRef)(null),y=(0,l.useRef)(null),g=(0,l.useRef)(null),[h,v]=(0,l.useState)("1000"),[N,C]=(0,l.useState)("50000"),[j,k]=(0,l.useState)("80"),[S,R]=(0,l.useState)("50000"),[B,V]=(0,l.useState)(31.42.toString()),[w,F]=(0,l.useState)("5"),[M,$]=(0,l.useState)("32"),[T,H]=(0,l.useState)("hourlyrate"),[J,A]=(0,l.useState)(25),[E,I]=(0,l.useState)(null),[D,L]=(0,l.useState)(!1),[K,P]=(0,l.useState)({}),_=(0,l.useCallback)((e,a,t,l,s,n)=>{I(function(e,a,t,l,s,n,r,o){const i=u*(t/100),m=s/100,d=1+m+n/100*(1+m);let b,p,x;"hourlyrate"===e?(b=a,p=b*i,x=(p-l)/d):(x=12*a,p=x*d+l,b=p/i);const f=x/12,y=x*(1-r/100)/12,g=x*(o/c)/12,h=x*d;return{turnover:Math.round(p),fixedCosts:l,hourlyRate:Math.round(b),billableHours:Math.round(i),netSalary:Math.round(y),grossSalary:Math.round(f),vacationPay:Math.round(g),totalStaffCost:Math.round(h)}}(T,e,a,t,l,s,n,J))},[T,J]),G=(0,l.useCallback)(()=>{const e=(0,r.BH)(h),a=(0,r.BH)(N),l=(0,r.BH)(j),s=(0,r.BH)(S),n=(0,r.BH)(B),o=(0,r.BH)(w),i=(0,r.BH)(M),c=parseFloat(e),u=parseFloat(a),m=parseFloat(l),g=parseFloat(s),v=parseFloat(n),C=parseFloat(o),k=parseFloat(i),R={};return"hourlyrate"===T&&(h.trim()?(!Number.isFinite(c)||c<=0)&&(R.hourlyRate="Timarvode måste vara större än 0"):R.hourlyRate="Ange timarvode i SEK"),"monthlysalary"===T&&(N.trim()?(!Number.isFinite(u)||u<=0)&&(R.salary="Månadslön måste vara större än 0"):R.salary="Ange månadslön i SEK"),j.trim()?(!Number.isFinite(m)||m<=0||m>100)&&(R.occupancy="Beläggning måste vara mellan 1 och 100"):R.occupancy="Ange beläggning i %",S.trim()?(!Number.isFinite(g)||g<0)&&(R.fixedCost="Fasta kostnader måste vara 0 eller större"):R.fixedCost="Ange fasta kostnader i SEK",B.trim()?(!Number.isFinite(v)||v<0||v>100)&&(R.socialSecurityContribution="Sociala avgifter måste vara mellan 0 och 100"):R.socialSecurityContribution="Ange sociala avgifter i %",w.trim()?(!Number.isFinite(C)||C<0||C>100)&&(R.pension="Pensionsavsättning måste vara mellan 0 och 100"):R.pension="Ange pensionsavsättning i %",M.trim()?(!Number.isFinite(k)||k<0||k>100)&&(R.taxes="Skatt måste vara mellan 0 och 100"):R.taxes="Ange skatt i %",d.current&&d.current.setCustomValidity(R.hourlyRate??""),t.current&&t.current.setCustomValidity(R.salary??""),b.current&&b.current.setCustomValidity(R.occupancy??""),p.current&&p.current.setCustomValidity(R.fixedCost??""),x.current&&x.current.setCustomValidity(R.socialSecurityContribution??""),f.current&&f.current.setCustomValidity(R.pension??""),y.current&&y.current.setCustomValidity(R.taxes??""),P(R),Object.keys(R).length>0?(R.hourlyRate&&d.current?d.current.reportValidity():R.salary&&t.current?t.current.reportValidity():R.occupancy&&b.current?b.current.reportValidity():R.fixedCost&&p.current?p.current.reportValidity():R.socialSecurityContribution&&x.current?x.current.reportValidity():R.pension&&f.current?f.current.reportValidity():R.taxes&&y.current&&y.current.reportValidity(),null):{inputValue:"hourlyrate"===T?c:u,occupancy:m,fixedCost:g,socialSecurityContribution:v,pension:C,taxes:k}},[T,S,h,j,w,N,B,M]),O=(0,l.useCallback)(()=>{const e=G();e&&(window.innerWidth<768&&a.current&&(0,o.P)(a.current,void 0,10),g.current&&clearTimeout(g.current),L(!0),g.current=setTimeout(()=>{_(e.inputValue,e.occupancy,e.fixedCost,e.socialSecurityContribution,e.pension,e.taxes),L(!1),g.current=null},1500))},[_,G]);(0,l.useEffect)(()=>()=>{g.current&&clearTimeout(g.current)},[]);return(0,m.jsx)(r.tE,{className:"hourlyRateCalculatorBlock",children:(0,m.jsxs)(r.e$,{className:"row gx-md-5 gy-5",children:[(0,m.jsx)("div",{className:"col-12 col-md-6",children:(0,m.jsxs)("div",{className:"d-flex flex-column",children:[e.heading||e.description?(0,m.jsxs)("div",{className:"mb-8 mb-md-12",children:[e.heading&&(0,m.jsx)("h2",{className:"my-0 "+(e.useContainer?"h4":"h5"),children:e.heading}),e.description&&(0,m.jsx)("div",{className:"mt-6",children:e.description})]}):null,(0,m.jsxs)("div",{className:"mb-6 mb-md-10",children:[(0,m.jsxs)("div",{className:"form-label mt-0 mb-2 d-flex align-items-center gap-2",children:[(0,m.jsx)("span",{children:"Beräkna från"}),e.calculationHelpText&&(0,m.jsx)("button",{type:"button",className:"btn-info-icon btn-info-icon--sm","data-bs-toggle":"tooltip","data-bs-trigger":"hover focus","data-bs-placement":"top",title:e.calculationHelpText,children:(0,m.jsx)("span",{className:"visually-hidden",children:"Mer information kring beräkningen"})})]}),(0,m.jsx)(n.A,{color:"dark",className:"flex-column",options:[{value:"hourlyrate",label:"Timarvode → månadslön"},{value:"monthlysalary",label:"Önskad månadslön → timarvode"}],selectedValue:T,onSelect:H})]}),"hourlyrate"===T?(0,m.jsx)(r.sR,{ref:d,id:"employeeHourlyRateInput",label:"Hur mycket fakturerar du per timme? (exkl. moms)",value:h,onValueChange:e=>{v(e),K.hourlyRate&&P(e=>{const{hourlyRate:a,...t}=e;return t}),d.current&&d.current.setCustomValidity("")},className:"mb-6 mb-md-10",errorMessage:K.hourlyRate}):(0,m.jsx)(r.sR,{ref:t,id:"employeeSalaryInput",label:"Önskad månadslön i SEK (innan skatt)",value:N,onValueChange:e=>{C(e),K.salary&&P(e=>{const{salary:a,...t}=e;return t}),t.current&&t.current.setCustomValidity("")},className:"mb-6 mb-md-10",errorMessage:K.salary}),(0,m.jsx)(r.sR,{ref:b,id:"employeeOccupancyInput",label:"Beläggning (andel av året du kan fakturera)",helpText:e.occupancyHelpText,helpTextSrLabel:"Mer information kring beläggning",value:j,onValueChange:e=>{k(e),K.occupancy&&P(e=>{const{occupancy:a,...t}=e;return t}),b.current&&b.current.setCustomValidity("")},className:"mb-6 mb-md-10",errorMessage:K.occupancy}),(0,m.jsx)(r.sR,{ref:p,id:"employeeFixedCostInput",label:"Fasta kostnader per år i SEK (t.ex. kontorsplats, utrustning, programvaror)",value:S,onValueChange:e=>{R(e),K.fixedCost&&P(e=>{const{fixedCost:a,...t}=e;return t}),p.current&&p.current.setCustomValidity("")},className:"mb-6 mb-md-10",errorMessage:K.fixedCost}),(0,m.jsxs)("div",{className:"mb-6 mb-md-10",children:[(0,m.jsxs)("label",{className:"form-label mt-0 mb-2 d-flex align-items-center gap-2",htmlFor:"employee

1VacationDaysInput",children:[(0,m.jsx)("span",{children:"Semesterdagar"}),e.vacationHelpText&&(0,m.jsx)("button",{type:"button",className:"btn-info-icon btn-info-icon--sm","data-bs-toggle":"tooltip","data-bs-trigger":"hover focus","data-bs-placement":"top",title:e.vacationHelpText,children:(0,m.jsx)("span",{className:"visually-hidden",children:"Mer information kring semesterdagar"})})]}),(0,m.jsx)(s.J,{id:"employeeVacationDaysInput",value:J,onChange:A,buttonClassName:"",inputClassName:"",min:0,max:365})]}),(0,m.jsx)(r.sR,{ref:x,id:"employeeSocialSecurityContributionInput",label:"Sociala avgifter (arbetsgivaravgift) i %",value:B,onValueChange:e=>{V(e),K.socialSecurityContribution&&P(e=>{const{socialSecurityContribution:a,...t}=e;return t}),x.current&&x.current.setCustomValidity("")},className:"mb-6 mb-md-10",errorMessage:K.socialSecurityContribution}),(0,m.jsx)(r.sR,{ref:f,id:"employeePensionInput",label:"Avsättning till tjänstepension i % av bruttolön",value:w,onValueChange:e=>{F(e),K.pension&&P(e=>{const{pension:a,...t}=e;return t}),f.current&&f.current.setCustomValidity("")},className:"mb-6 mb-md-10",errorMessage:K.pension}),(0,m.jsx)(r.sR,{ref:y,id:"employeeTaxesInput",label:"Kommunal/statlig skatt (förenklad, på lönen) i %",value:M,onValueChange:e=>{$(e),K.taxes&&P(e=>{const{taxes:a,...t}=e;return t}),y.current&&y.current.setCustomValidity("")},className:"mb-6 mb-md-10",errorMessage:K.taxes}),(0,m.jsx)("div",{children:(0,m.jsx)("button",{className:"btn btn-primary w-100 calculatorBlock-submit",onClick:O,children:"Beräkna"})})]})}),(0,m.jsx)("div",{className:"col-12 col-md-6",children:(0,m.jsxs)(r._i,{ref:a,children:[(0,m.jsx)("h3",{className:"h5 mt-0 mb-6 mb-md-10",children:"Resultat"}),(0,m.jsx)("div",{className:"calculatorBlock-loading-wrapper",children:D&&(0,m.jsxs)("div",{className:"calculatorBlock-loading-dots","aria-hidden":"true",children:[(0,m.jsx)("span",{className:"calculatorBlock-loading-dot"}),(0,m.jsx)("span",{className:"calculatorBlock-loading-dot"}),(0,m.jsx)("span",{className:"calculatorBlock-loading-dot"})]})}),(0,m.jsx)(r.C,{children:"hourlyrate"===T?(0,m.jsxs)(m.Fragment,{children:[(0,m.jsx)(r.Jb,{label:"Månadslön (före skatt)",value:E?(0,r.Rb)(E.grossSalary):"—",color:"coral",classNameContent:e.useContainer?"calculatorBlock-result-item fw-bolder":"flex-column"}),(0,m.jsx)(r.Jb,{label:"Månadslön (efter skatt)",value:E?(0,r.Rb)(E.netSalary):"—",color:"green",classNameContent:e.useContainer?"calculatorBlock-result-item fw-bolder":"flex-column",className:"mb-6"}),(0,m.jsx)(r.Jb,{label:"Timarvode (SEK/timme)",value:E?(0,r.Rb)(E.hourlyRate):"—",color:"blue",classNameContent:e.useContainer?"calculatorBlock-result-item":"flex-column"}),(0,m.jsx)(r.Jb,{label:"Debiterbara timmar per år",value:E?(0,r.GP)(E.billableHours)+" timmar":"—",color:"purple",classNameContent:e.useContainer?"calculatorBlock-result-item":"flex-column"}),(0,m.jsx)(r.Jb,{label:"Omsättning per år",value:E?(0,r.Rb)(E.turnover):"—",color:"yellow",classNameContent:e.useContainer?"calculatorBlock-result-item":"flex-column"}),(0,m.jsx)(r.Jb,{label:"Återstående för lön, pension och sociala avgifter",value:E?(0,r.Rb)(E.turnover-E.fixedCosts):"—",color:"coral",classNameContent:e.useContainer?"calculatorBlock-result-item":"flex-column"}),(0,m.jsx)(r.Jb,{label:"Semesterdagar motsvarar ungefär",value:E?(0,r.Rb)(E.vacationPay):"—",color:"green",classNameContent:e.useContainer?"calculatorBlock-result-item":"flex-column"})]}):(0,m.jsxs)(m.Fragment,{children:[(0,m.jsx)(r.Jb,{label:"Timarvode (SEK/timme exkl. moms)",value:E?(0,r.Rb)(E.hourlyRate):"—",color:"yellow",classNameContent:e.useContainer?"calculatorBlock-result-item fw-bolder":"flex-column"}),(0,m.jsx)(r.Jb,{label:"Månadslön (före skatt)",value:E?(0,r.Rb)(E.grossSalary):"—",color:"green",classNameContent:e.useContainer?"calculatorBlock-result-item fw-bolder":"flex-column"}),(0,m.jsx)(r.Jb,{label:"Månadslön (efter skatt)",value:E?(0,r.Rb)(E.netSalary):"—",color:"blue",classNameContent:e.useContainer?"calculatorBlock-result-item fw-bolder":"flex-column",className:"mb-6"}),(0,m.jsx)(r.Jb,{label:"Total personalkostnad",value:E?(0,r.Rb)(E.totalStaffCost):"—",color:"coral",classNameContent:e.useContainer?"calculatorBlock-result-item":"flex-column"}),(0,m.jsx)(r.Jb,{label:"Debiterbara timmar per år",value:E?(0,r.GP)(E.billableHours)+" timmar":"—",color:"purple",classNameContent:e.useContainer?"calculatorBlock-result-item":"flex-column"})]})})]})}),e.explanationText&&(0,m.jsx)("div",{className:"col-12 mt-10",children:(0,m.jsx)("div",{dangerouslySetInnerHTML:{__html:(0,i.pn)(e.explanationText)}})})]})})}}

1,5028:function(e,a,t){var l=t(6540),s=t(4848);const n=e=>e.replace(",","."),r=(0,l.forwardRef)(({className:e="",...a},t)=>(0,s.jsx)("div",{...a,ref:t,className:`calculatorBlock p-8 p-md-12 bg-color-primary-100 rounded-5 ${e}`}));r.displayName="Calculator";const o=(0,l.forwardRef)(({className:e="",...a},t)=>(0,s.jsx)("div",{...a,ref:t,className:`row gx-md-5 gy-5 ${e}`}));o.displayName="CalculatorContent";const i=(0,l.forwardRef)(({className:e="",...a},t)=>(0,s.jsx)("div",{...a,ref:t,className:`d-flex align-items-center justify-content-center position-relative ${e}`}));i.displayName="CalculatorChartContainer";const c=(0,l.forwardRef)(({className:e="",...a},t)=>(0,s.jsx)("div",{...a,ref:t,className:`h-100 p-6 bg-color-white rounded-4 d-flex flex-column ${e}`}));c.displayName="CalculatorResult";const u=(0,l.forwardRef)(({className:e="",...a},t)=>(0,s.jsx)("div",{...a,ref:t,className:`d-flex mb-6 mb-md-10 gap-2 align-items-end justify-content-center calculatorBlock-total-cost ${e}`}));u.displayName="CalculatorResultTotal";const m=(0,l.forwardRef)(({className:e="",...a},t)=>(0,s.jsx)("ul",{...a,ref:t,className:`d-flex flex-column gap-3 mb-6 mb-md-10 pl-0 ${e}`}));m.displayName="CalculatorResultList";const d=(0,l.forwardRef)(({label:e,value:a,color:t,className:l="",classNameContent:n="",...r},o)=>(0,s.jsxs)("li",{...r,ref:o,className:`d-flex align-items-center gap-1 p-3 mb-0 bg-color-neutral-100 rounded-3 ${l}`,children:[(0,s.jsx)("div",{className:`calculatorBlock-dot calculatorBlock-dot--${t}`}),(0,s.jsxs)("div",{className:`d-flex flex-wrap gap-1 justify-content-between w-100 ml-3 ${n}`,children:[(0,s.jsx)("span",{className:"calculatorBlock-result-label",children:e}),(0,s.jsx)("span",{className:"calculatorBlock-result-value",children:a})]})]}));d.displayName="CalculatorResultItem";const b=(0,l.forwardRef)(({id:e,label:a,helpText:t,helpTextSrLabel:l="Mer information",value:r,onValueChange:o,placeholder:i="0",maxAmount:c=999999999,minAmount:u=0,className:m="",inputClassName:d="",clearAriaLabel:b="Rensa",errorMessage:p},x)=>(0,s.jsxs)("div",{className:`${m}`,children:[(0,s.jsxs)("label",{className:"form-label mt-0 mb-2 "+(t?"d-flex align-items-center gap-2":""),htmlFor:e,children:[(0,s.jsx)("span",{children:a}),t&&(0,s.jsx)("button",{type:"button",className:"btn-info-icon btn-info-icon--sm","data-bs-toggle":"tooltip","data-bs-trigger":"hover focus","data-bs-placement":"top",title:t,children:(0,s.jsx)("span",{className:"visually-hidden",children:l})})]}),(0,s.jsxs)("div",{className:"position-relative",children:[(0,s.jsx)("input",{ref:x,type:"tel",inputMode:"decimal",id:e,value:r,onChange:e=>{const a=((e,a,t)=>{const l=e.replace(/[^0-9.,]/g,""),s=parseFloat(n(l));return!Number.isNaN(s)&&(s>t||s<a)?null:l})(e.target.value,u,c);null!==a&&o(a)},placeholder:i,className:`form-control mb-0 ${p?"is-invalid":""} ${d}`,"aria-invalid":Boolean(p)}),r&&(0,s.jsx)("button",{type:"button",onClick:()=>o(""),className:"calculatorBlock-clear-btn","aria-label":b,children:(0,s.jsxs)("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[(0,s.jsx)("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),(0,s.jsx)("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]})})]}),p&&(0,s.jsx)("p",{className:"text-danger mt-2 mb-0",children:p})]}));b.displayName="CalculatorNumberInput",t.d(a,["BH",0,n,"C",0,m,"GP",0,e=>e.toLocaleString("sv-SE",{minimumFractionDigits:2,maximumFractionDigits:2}),"Jb",0,d,"Rb",0,e=>e.toLocaleString("sv-SE",{minimumFractionDigits:2,maximumFractionDigits:2})+" kr","_H",0,i,"_i",0,c,"e$",0,o,"fU",0,e=>(()=>{const a=Math.max(0,Math.round(e)),t=a%60;return`${Math.floor(a/60).toString().padStart(2,"0")}:${t.toString().padStart(2,"0")}`})(),"l9",0,e=>(100*e).toLocaleString("sv-SE",{minimumFractionDigits:2,maximumFractionDigits:2})+" %","sR",0,b,"tE",0,r,"uj",0,u])},4498:function(e,a,t){t.d(a,{A:function(){return s}});var l=t(4848);function s({color:e,options:a,selectedValue:t,onSelect:s,className:n=""}){const r="primary"===e?"segmented-buttons--primary":"segmented-buttons--dark";return(0,l.jsx)("div",{className:`d-flex flex-wrap bg-color-white rounded-4 segmented-buttons ${r} ${n}`.trim(),children:a.map(e=>(0,l.jsx)("button",{type:"button",onClick:()=>s(e.value),className:"btn segmented-buttons-btn "+(t===e.value?"active":""),children:e.label},String(e.value)))})}},9073:function(e,a,t){t.d(a,{J:function(){return s}});t(6540);

1var l=t(4848);function s(e){const{id:a,value:t,onChange:s,min:n=0,max:r=1/0,step:o=1,disabled:i=!1,className:c="",buttonClassName:u="",inputClassName:m=""}=e,d=Number.isFinite(r)?r:void 0;const b=i||t<=n,p=i||t>=r;return(0,l.jsxs)("div",{className:`step-input d-flex bg-color-white rounded-4 ${c}`,children:[(0,l.jsxs)("button",{onClick:function(){const e=t-o;e>=n&&s(e)},disabled:b,className:`btn step-input-button ${u}`,type:"button",children:[(0,l.jsx)("span",{className:"visually-hidden",children:"Minska värde"}),(0,l.jsx)("span",{"aria-hidden":"true",className:"icon-minus21"})]}),(0,l.jsx)("input",{type:"text",id:a,value:t,onChange:function(e){const a=e.target.value.trim();if(""===a)return void s(n);const t=parseInt(a,10);!Number.isNaN(t)&&t>=n&&t<=r&&s(t)},disabled:i,className:`form-control mb-0 text-center step-input-input ${m}`,min:n,max:d,step:o}),(0,l.jsxs)("button",{onClick:function(){const e=t+o;e<=r&&s(e)},disabled:p,className:`btn step-input-button ${u}`,type:"button",children:[(0,l.jsx)("span",{className:"visually-hidden",children:"Öka värde"}),(0,l.jsx)("span",{"aria-hidden":"true",className:"icon-plus2"})]})]})}},9698:function(e,a){
2/**
3 * @license React
4 * react-jsx-runtime.production.js
5 *
6 * Copyright (c) Meta Platforms, Inc. and affiliates.
7 *
8 * This source code is licensed under the MIT license found in the
9 * LICENSE file in the root directory of this source tree.
10 */
11var t=Symbol.for("react.transitional.element"),l=Symbol.for("react.fragment");function s(e,a,l){var s=null;if(void 0!==l&&(s=""+l),void 0!==a.key&&(s=""+a.key),"key"in a)for(var n in l={},a)"key"!==n&&(l[n]=a[n]);else l=a;return a=l.ref,{$$typeof:t,type:e,key:s,ref:void 0!==a?a:null,props:l}}a.Fragment=l,a.jsx=s,a.jsxs=s},4848:function(e,a,t){e.exports=t(9698)}}]);