2 lines
8.9 KiB
JavaScript
2 lines
8.9 KiB
JavaScript
import{r as v,j as t}from"./chunk-UIGDSWPH-BhuNDbxn.js";const j=()=>t.jsx("svg",{width:"1em",height:"1em",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"text-success-500",children:t.jsx("path",{d:"M13.4017 4.35986L6.12166 11.6399L2.59833 8.11657",stroke:"currentColor",strokeWidth:"1.8",strokeLinecap:"round",strokeLinejoin:"round"})}),u=()=>t.jsx("svg",{width:"1em",height:"1em",viewBox:"0 0 17 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"text-gray-400",children:t.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M4.05394 4.78033C3.76105 4.48744 3.76105 4.01256 4.05394 3.71967C4.34684 3.42678 4.82171 3.42678 5.1146 3.71967L8.33437 6.93944L11.5521 3.72173C11.845 3.42883 12.3199 3.42883 12.6127 3.72173C12.9056 4.01462 12.9056 4.48949 12.6127 4.78239L9.39503 8.0001L12.6127 11.2178C12.9056 11.5107 12.9056 11.9856 12.6127 12.2785C12.3198 12.5713 11.845 12.5713 11.5521 12.2785L8.33437 9.06076L5.11462 12.2805C4.82173 12.5734 4.34685 12.5734 4.05396 12.2805C3.76107 11.9876 3.76107 11.5127 4.05396 11.2199L7.27371 8.0001L4.05394 4.78033Z",fill:"currentColor"})});function C({variant:x="1",title:w,subtitle:N,plans:c,showToggle:h=!1,onPlanSelect:m,className:g=""}){const[d,f]=v.useState("monthly"),b=e=>{e.disabled||m==null||m(e)},n=e=>typeof e=="number"?e.toFixed(2):e,k=e=>{const i=typeof e.monthlyPrice=="number"?e.monthlyPrice:typeof e.price=="number"?e.price:parseFloat(String(e.price||0));if(d==="annually"&&h){const r=i*12*.8,s=i*12;return{price:r,originalPrice:s}}return{price:i}};return x==="1"?t.jsxs("div",{className:`space-y-6 ${g}`,children:[w&&t.jsx("div",{className:"mx-auto w-full max-w-[385px]",children:t.jsx("h2",{className:"font-bold text-center text-gray-800 mb-7 text-title-sm dark:text-white/90",children:w})}),h&&t.jsx("div",{className:"mb-10 text-center",children:t.jsxs("div",{className:"relative inline-flex p-1 mx-auto bg-gray-200 rounded-full z-1 dark:bg-gray-800",children:[t.jsx("span",{className:`absolute top-1/2 -z-1 flex h-11 w-[120px] -translate-y-1/2 rounded-full bg-white shadow-theme-xs duration-200 ease-linear dark:bg-white/10 ${d==="monthly"?"translate-x-0":"translate-x-[120px]"}`}),t.jsx("button",{onClick:()=>f("monthly"),className:`flex h-11 w-[120px] items-center justify-center text-base font-medium transition-colors ${d==="monthly"?"text-gray-800 dark:text-white/90":"text-gray-500 hover:text-gray-700 dark:hover:text-white/80 dark:text-gray-400"}`,children:"Monthly"}),t.jsx("button",{onClick:()=>f("annually"),className:`flex h-11 w-[120px] items-center justify-center text-base font-medium transition-colors ${d==="annually"?"text-gray-800 dark:text-white/90":"text-gray-500 hover:text-gray-700 dark:hover:text-white/80 dark:text-gray-400"}`,children:"Annually"})]})}),t.jsx("div",{className:"grid gap-5 grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 xl:gap-6",children:c.map((e,i)=>{const r=e.highlighted||!1,s=k(e),l=d==="annually"&&h?"/year":e.period||"/month";return t.jsxs("div",{className:`rounded-2xl border p-6 flex flex-col ${r?"bg-gray-800 border-gray-800 dark:border-white/10 dark:bg-white/10":"border-gray-200 bg-white dark:border-gray-800 dark:bg-white/[0.03]"}`,children:[t.jsx("span",{className:`block mb-3 font-semibold text-theme-xl ${r?"text-white":"text-gray-800 dark:text-white/90"}`,children:e.name}),t.jsxs("div",{className:"flex items-center justify-between mb-1",children:[t.jsxs("div",{className:"flex items-end",children:[t.jsxs("h2",{className:`font-bold text-title-md ${r?"text-white":"text-gray-800 dark:text-white/90"}`,children:["$",n(s.price)]}),t.jsx("span",{className:`inline-block mb-1 text-sm ${r?"text-white/70":"text-gray-500 dark:text-gray-400"}`,children:l})]}),(s.originalPrice||e.originalPrice)&&t.jsxs("span",{className:`font-semibold line-through text-theme-xl ${r?"text-gray-300":"text-gray-400"}`,children:["$",n(s.originalPrice||e.originalPrice||0)]})]}),e.description&&t.jsx("p",{className:`text-sm ${r?"text-white/70":"text-gray-500 dark:text-gray-400"}`,children:e.description}),t.jsx("div",{className:`w-full h-px my-6 ${r?"bg-white/20":"bg-gray-200 dark:bg-gray-800"}`}),t.jsx("ul",{className:"mb-8 space-y-3 flex-grow",children:e.features.map((a,o)=>{const y=a.startsWith("!"),p=y?a.substring(1):a;return t.jsxs("li",{className:`flex items-center gap-3 text-sm ${r?"text-white/80":y?"text-gray-400":"text-gray-500 dark:text-gray-400"}`,children:[y?t.jsx(u,{}):t.jsx(j,{}),p]},o)})}),t.jsx("button",{onClick:()=>b(e),disabled:e.disabled,className:`flex w-full items-center justify-center rounded-lg p-3.5 text-sm font-medium text-white shadow-theme-xs transition-colors mt-auto ${r?"bg-brand-500 hover:bg-brand-600 dark:hover:bg-brand-600":"bg-gray-800 hover:bg-brand-500 dark:bg-white/10 dark:hover:bg-brand-600"} ${e.disabled?"opacity-50 cursor-not-allowed":""}`,children:e.buttonText||"Choose Plan"})]},e.id||i)})})]}):x==="2"?t.jsx("div",{className:`space-y-6 ${g}`,children:t.jsx("div",{className:"grid gap-5 grid-cols-1 sm:grid-cols-2 xl:grid-cols-3 xl:gap-6",children:c.map((e,i)=>{const r=e.highlighted||i===1;return t.jsxs("div",{className:`rounded-2xl border p-6 xl:p-8 ${r?"border-2 border-brand-500 bg-white dark:border-brand-500 dark:bg-white/[0.03]":"border-gray-200 bg-white dark:border-gray-800 dark:bg-white/[0.03]"}`,children:[t.jsxs("div",{className:"flex items-start justify-between -mb-4",children:[t.jsx("span",{className:"block font-semibold text-gray-800 text-theme-xl dark:text-white/90",children:e.name}),e.icon&&t.jsx("span",{className:"flex h-[56px] dark:bg-brand-500/10 w-[56px] items-center justify-center rounded-[10.5px] bg-brand-50 text-brand-500",children:e.icon})]}),t.jsxs("div",{className:"flex items-end",children:[t.jsxs("h2",{className:"font-bold text-gray-800 text-title-md dark:text-white/90",children:["$",n(e.price)]}),t.jsx("span",{className:"inline-block mb-1 text-sm text-gray-500 dark:text-gray-400",children:e.period||" / Lifetime"})]}),e.description&&t.jsx("p",{className:"mt-1 text-sm text-gray-500 dark:text-gray-400",children:e.description}),t.jsx("div",{className:"w-full h-px my-6 bg-gray-200 dark:bg-gray-800"}),t.jsx("ul",{className:"mb-8 space-y-3",children:e.features.map((s,l)=>{const a=s.startsWith("!"),o=a?s.substring(1):s;return t.jsxs("li",{className:`flex items-center gap-3 text-sm ${a?"text-gray-400":"text-gray-700 dark:text-gray-400"}`,children:[a?t.jsx(u,{}):t.jsx(j,{}),o]},l)})}),t.jsx("button",{onClick:()=>b(e),disabled:e.disabled,className:`flex w-full items-center justify-center rounded-lg p-3.5 text-sm font-medium text-white shadow-theme-xs transition-colors ${r?"bg-brand-500 hover:bg-brand-600":"bg-gray-800 hover:bg-brand-500 dark:bg-white/10 dark:hover:bg-brand-600"} ${e.disabled?"opacity-50 cursor-not-allowed":""}`,children:e.buttonText||(r?"Choose This Plan":"Choose Starter")})]},e.id||i)})})}):x==="3"?t.jsx("div",{className:`space-y-6 ${g}`,children:t.jsx("div",{className:"grid gap-5 grid-cols-1 sm:grid-cols-2 xl:grid-cols-3 xl:gap-3 2xl:grid-cols-4",children:c.map((e,i)=>{const r=e.recommended||i===2;return t.jsx("div",{children:t.jsxs("div",{className:`rounded-2xl p-6 ${r?"relative bg-brand-500":"bg-white dark:bg-white/[0.03]"}`,children:[r&&t.jsx("div",{className:"absolute px-3 py-1 font-medium text-white rounded-lg right-4 top-4 -z-1 bg-white/10 text-theme-xs",children:"Recommended"}),t.jsx("span",{className:`block font-semibold text-theme-xl ${r?"text-white":"text-gray-800 dark:text-white/90"}`,children:e.name}),e.description&&t.jsx("p",{className:`mt-1 text-sm ${r?"text-white/90":"text-gray-500 dark:text-gray-400"}`,children:e.description}),t.jsx("h2",{className:`mb-0.5 mt-4 text-title-sm font-bold ${r?"text-white":"text-gray-800 dark:text-white/90"}`,children:typeof e.price=="string"&&e.price.toLowerCase()==="free"?"Free":`$${n(e.price)}`}),t.jsx("span",{className:`inline-block mb-6 text-sm ${r?"text-white/90":"text-gray-500 dark:text-gray-400"}`,children:e.period||"For a Lifetime"}),t.jsx("button",{onClick:()=>b(e),disabled:e.disabled,className:`flex h-11 w-full items-center justify-center rounded-lg p-3.5 text-sm font-medium shadow-theme-xs transition-colors ${r?"bg-white text-gray-800 hover:bg-gray-50":e.disabled?"border border-gray-300 bg-white text-gray-400 disabled:pointer-events-none dark:border-gray-700 dark:bg-gray-800 dark:hover:bg-white/[0.03] dark:hover:text-gray-200":"bg-brand-500 text-white hover:bg-brand-600"}`,children:e.buttonText||(e.disabled?"Current Plan":"Try for Free")}),t.jsx("ul",{className:"mt-6 space-y-3",children:e.features.map((s,l)=>{const a=s.startsWith("!"),o=a?s.substring(1):s;return t.jsxs("li",{className:`flex items-center gap-3 text-sm ${r?"text-white":a?"text-gray-400":"text-gray-700 dark:text-gray-400"}`,children:[a?t.jsx(u,{}):t.jsx("svg",{width:"1em",height:"1em",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:r?"text-white":"text-success-500",children:t.jsx("path",{d:"M13.4017 4.35986L6.12166 11.6399L2.59833 8.11657",stroke:"currentColor",strokeWidth:"1.8",strokeLinecap:"round",strokeLinejoin:"round"})}),o]},l)})})]})},e.id||i)})})}):null}export{C as P};
|