@designbasekorea/figma-ui 0.1.87 → 0.1.89

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -623,21 +623,28 @@ const defaultFeatures = [
623
623
  const defaultPricing = {
624
624
  monthly: 2,
625
625
  yearly: 21.6,
626
+ lifetime: 50,
626
627
  };
627
- const PricingComparison = ({ features = defaultFeatures, pricing = defaultPricing, t = (key) => key, className, }) => {
628
+ const PricingComparison = ({ features = defaultFeatures, pricing = defaultPricing, paymentType = 'subscription', t = (key) => key, className, }) => {
628
629
  const [isYearly, setIsYearly] = React.useState(false);
629
630
  const getPrice = () => {
631
+ if (paymentType === 'lifetime') {
632
+ return `$${pricing.lifetime?.toLocaleString()} - ${t('lifetimeAccess') || '평생 이용'}`;
633
+ }
630
634
  const price = isYearly ? pricing.yearly : pricing.monthly;
631
- return `$${price.toLocaleString()} / ${isYearly ? t('perYear') : t('perMonth')}`;
635
+ return `$${price?.toLocaleString()} / ${isYearly ? t('perYear') : t('perMonth')}`;
632
636
  };
633
637
  const getDiscountPercentage = () => {
634
- const monthlyPrice = pricing.monthly * 12;
635
- const yearlyPrice = pricing.yearly;
638
+ if (paymentType === 'lifetime') {
639
+ return null;
640
+ }
641
+ const monthlyPrice = (pricing.monthly || 0) * 12;
642
+ const yearlyPrice = pricing.yearly || 0;
636
643
  const discount = Math.round(((monthlyPrice - yearlyPrice) / monthlyPrice) * 100);
637
644
  return discount;
638
645
  };
639
646
  return (React.createElement("div", { className: `designbase-figma-pricing-comparison ${className || ''}` },
640
- React.createElement("div", { className: "designbase-figma-pricing-comparison__billing-toggle" },
647
+ paymentType === 'subscription' && (React.createElement("div", { className: "designbase-figma-pricing-comparison__billing-toggle" },
641
648
  React.createElement(ui.SegmentControl, { value: isYearly ? 'yearly' : 'monthly', onChange: (value) => setIsYearly(value === 'yearly'), options: [
642
649
  {
643
650
  value: 'monthly',
@@ -651,7 +658,9 @@ const PricingComparison = ({ features = defaultFeatures, pricing = defaultPricin
651
658
  getDiscountPercentage(),
652
659
  "% \uC808\uC57D"))),
653
660
  },
654
- ], size: "s" })),
661
+ ], size: "s" }))),
662
+ paymentType === 'lifetime' && (React.createElement("div", { className: "designbase-figma-pricing-comparison__lifetime-info" },
663
+ React.createElement("p", { className: "designbase-figma-pricing-comparison__lifetime-text" }, t('oneTimePaymentLifetime') || 'One-time payment for lifetime access!'))),
655
664
  React.createElement("table", { className: "designbase-figma-pricing-comparison__table" },
656
665
  React.createElement("thead", null,
657
666
  React.createElement("tr", null,
@@ -675,7 +684,7 @@ const PricingComparison = ({ features = defaultFeatures, pricing = defaultPricin
675
684
  };
676
685
  PricingComparison.displayName = 'PricingComparison';
677
686
 
678
- const PageLicense = ({ status: initialStatus, onClose, usageCount: initialUsageCount = 0, onLicenseSubmit, licenseKey: initialLicenseKey = '', setPaymentStatus, setUsageCount, setShowLicensePage, paymentPageUrl, t, className, }) => {
687
+ const PageLicense = ({ status: initialStatus, onClose, usageCount: initialUsageCount = 0, onLicenseSubmit, licenseKey: initialLicenseKey = '', setPaymentStatus, setUsageCount, setShowLicensePage, paymentPageUrl, pricingFeatures, pricing, paymentType = 'subscription', t, className, }) => {
679
688
  const [isSubmitting, setIsSubmitting] = React.useState(false);
680
689
  const [isDeactivating, setIsDeactivating] = React.useState(false);
681
690
  const [licenseKey, setLicenseKey] = React.useState(initialLicenseKey);
@@ -760,7 +769,7 @@ const PageLicense = ({ status: initialStatus, onClose, usageCount: initialUsageC
760
769
  React.createElement("p", { className: "designbase-figma-page-license__description" }, isPaid
761
770
  ? resolveText(t, { key: 'license.all_features_available' }, '모든 기능을 사용할 수 있습니다.')
762
771
  : resolveText(t, { key: 'license.purchase_for_unlimited' }, '라이선스 구매 후 무제한 접근이 가능합니다.'))),
763
- React.createElement(PricingComparison, { t: t }),
772
+ React.createElement(PricingComparison, { features: pricingFeatures, pricing: pricing, paymentType: paymentType, t: t }),
764
773
  isPaid && (React.createElement("div", { className: "designbase-figma-page-license__section" },
765
774
  React.createElement("div", { className: "designbase-figma-page-license__section-header" },
766
775
  React.createElement("h3", null, resolveText(t, { key: 'license.activated' }, '라이선스 활성화됨')),