@designbasekorea/figma-ui 0.1.87 → 0.1.89

package/dist/index.esm.js

@@ -622,21 +622,28 @@ const defaultFeatures = [
 const defaultPricing = {
     monthly: 2,
     yearly: 21.6,
+    lifetime: 50,
 };
-const PricingComparison = ({ features = defaultFeatures, pricing = defaultPricing, t = (key) => key, className, }) => {
+const PricingComparison = ({ features = defaultFeatures, pricing = defaultPricing, paymentType = 'subscription', t = (key) => key, className, }) => {
     const [isYearly, setIsYearly] = useState(false);
     const getPrice = () => {
+        if (paymentType === 'lifetime') {
+            return `$${pricing.lifetime?.toLocaleString()} - ${t('lifetimeAccess') || '평생 이용'}`;
+        }
         const price = isYearly ? pricing.yearly : pricing.monthly;
-        return `$${price.toLocaleString()} / ${isYearly ? t('perYear') : t('perMonth')}`;
+        return `$${price?.toLocaleString()} / ${isYearly ? t('perYear') : t('perMonth')}`;
     };
     const getDiscountPercentage = () => {
-        const monthlyPrice = pricing.monthly * 12;
-        const yearlyPrice = pricing.yearly;
+        if (paymentType === 'lifetime') {
+            return null;
+        }
+        const monthlyPrice = (pricing.monthly || 0) * 12;
+        const yearlyPrice = pricing.yearly || 0;
         const discount = Math.round(((monthlyPrice - yearlyPrice) / monthlyPrice) * 100);
         return discount;
     };
     return (React.createElement("div", { className: `designbase-figma-pricing-comparison ${className || ''}` },
-        React.createElement("div", { className: "designbase-figma-pricing-comparison__billing-toggle" },
+        paymentType === 'subscription' && (React.createElement("div", { className: "designbase-figma-pricing-comparison__billing-toggle" },
             React.createElement(SegmentControl, { value: isYearly ? 'yearly' : 'monthly', onChange: (value) => setIsYearly(value === 'yearly'), options: [
                     {
                         value: 'monthly',
@@ -650,7 +657,9 @@ const PricingComparison = ({ features = defaultFeatures, pricing = defaultPricin
                                 getDiscountPercentage(),
                                 "% \uC808\uC57D"))),
                     },
-                ], size: "s" })),
+                ], size: "s" }))),
+        paymentType === 'lifetime' && (React.createElement("div", { className: "designbase-figma-pricing-comparison__lifetime-info" },
+            React.createElement("p", { className: "designbase-figma-pricing-comparison__lifetime-text" }, t('oneTimePaymentLifetime') || 'One-time payment for lifetime access!'))),
         React.createElement("table", { className: "designbase-figma-pricing-comparison__table" },
             React.createElement("thead", null,
                 React.createElement("tr", null,
@@ -674,7 +683,7 @@ const PricingComparison = ({ features = defaultFeatures, pricing = defaultPricin
 };
 PricingComparison.displayName = 'PricingComparison';
 
-const PageLicense = ({ status: initialStatus, onClose, usageCount: initialUsageCount = 0, onLicenseSubmit, licenseKey: initialLicenseKey = '', setPaymentStatus, setUsageCount, setShowLicensePage, paymentPageUrl, t, className, }) => {
+const PageLicense = ({ status: initialStatus, onClose, usageCount: initialUsageCount = 0, onLicenseSubmit, licenseKey: initialLicenseKey = '', setPaymentStatus, setUsageCount, setShowLicensePage, paymentPageUrl, pricingFeatures, pricing, paymentType = 'subscription', t, className, }) => {
     const [isSubmitting, setIsSubmitting] = useState(false);
     const [isDeactivating, setIsDeactivating] = useState(false);
     const [licenseKey, setLicenseKey] = useState(initialLicenseKey);
@@ -759,7 +768,7 @@ const PageLicense = ({ status: initialStatus, onClose, usageCount: initialUsageC
                 React.createElement("p", { className: "designbase-figma-page-license__description" }, isPaid
                     ? resolveText(t, { key: 'license.all_features_available' }, '모든 기능을 사용할 수 있습니다.')
                     : resolveText(t, { key: 'license.purchase_for_unlimited' }, '라이선스 구매 후 무제한 접근이 가능합니다.'))),
-            React.createElement(PricingComparison, { t: t }),
+            React.createElement(PricingComparison, { features: pricingFeatures, pricing: pricing, paymentType: paymentType, t: t }),
             isPaid && (React.createElement("div", { className: "designbase-figma-page-license__section" },
                 React.createElement("div", { className: "designbase-figma-page-license__section-header" },
                     React.createElement("h3", null, resolveText(t, { key: 'license.activated' }, '라이선스 활성화됨')),