@omnikit-js/ui 0.9.14 → 0.9.15

package/dist/{chunk-WV3EEYAL.js → chunk-EJC6ZIK2.js}

@@ -351,6 +351,24 @@ async function calculateTax(config, params) {
   }
   return { success: true, data: result.data };
 }
+async function updateCustomer(config, customerId, data) {
+  const { baseUrl, projectId } = config;
+  const result = await fetchAPI(
+    config,
+    `${baseUrl}/billing/customers/${customerId}`,
+    {
+      method: "PUT",
+      body: JSON.stringify({
+        project_id: projectId,
+        ...data
+      })
+    }
+  );
+  if (!result.success) {
+    return { success: false, error: result.error || "Failed to update customer" };
+  }
+  return { success: true, data: result.data };
+}
 function UsageBar({ label, used, limit, unit = "" }) {
   const percentage = limit > 0 ? used / limit * 100 : 0;
   const isWarning = percentage > 80;
@@ -407,6 +425,22 @@ function BillingContent({
   const [upgradeSuccess, setUpgradeSuccess] = useState(false);
   const [taxInfo, setTaxInfo] = useState(initialTaxInfo || null);
   const [taxLoading, setTaxLoading] = useState(false);
+  const [preferencesForm, setPreferencesForm] = useState({
+    name: customer.name || "",
+    email: customer.email || "",
+    phone: customer.phone || "",
+    customer_type: customer.customer_type || "individual",
+    company_name: customer.company_name || "",
+    vat_number: customer.vat_number || "",
+    address_line1: customer.address?.line1 || "",
+    address_line2: customer.address?.line2 || "",
+    address_city: customer.address?.city || "",
+    address_state: customer.address?.state || "",
+    address_postal_code: customer.address?.postal_code || "",
+    address_country: customer.address?.country || ""
+  });
+  const [preferencesSaving, setPreferencesSaving] = useState(false);
+  const [preferencesSuccess, setPreferencesSuccess] = useState(false);
   useEffect(() => {
     async function loadStripeConfig() {
       setStripeLoading(true);
@@ -543,6 +577,40 @@ function BillingContent({
     setSelectedUpgradePaymentMethod(null);
     setTaxInfo(null);
   };
+  const handleSavePreferences = async () => {
+    setPreferencesSaving(true);
+    setError(null);
+    setPreferencesSuccess(false);
+    try {
+      const updateData = {
+        name: preferencesForm.name || void 0,
+        email: preferencesForm.email || void 0,
+        phone: preferencesForm.phone || void 0,
+        customer_type: preferencesForm.customer_type,
+        company_name: preferencesForm.customer_type === "business" ? preferencesForm.company_name : void 0,
+        vat_number: preferencesForm.vat_number || void 0,
+        address: {
+          line1: preferencesForm.address_line1 || void 0,
+          line2: preferencesForm.address_line2 || void 0,
+          city: preferencesForm.address_city || void 0,
+          state: preferencesForm.address_state || void 0,
+          postal_code: preferencesForm.address_postal_code || void 0,
+          country: preferencesForm.address_country || void 0
+        }
+      };
+      const result = await updateCustomer(actionConfig, customer.id, updateData);
+      if (!result.success) {
+        setError(result.error || "Failed to save preferences");
+      } else {
+        setPreferencesSuccess(true);
+        router.refresh();
+      }
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "An error occurred");
+    } finally {
+      setPreferencesSaving(false);
+    }
+  };
   const handleSetDefaultPaymentMethod = async (pm) => {
     setIsLoading(true);
     setError(null);
@@ -794,6 +862,256 @@ function BillingContent({
           )
         ] })
       ] }) })
+    },
+    {
+      id: "preferences",
+      label: "Preferences",
+      content: /* @__PURE__ */ jsx("div", { className: "mt-6", children: /* @__PURE__ */ jsxs(Card, { children: [
+        /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold mb-2", children: "Billing Preferences" }),
+        /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-600 dark:text-gray-400 mb-6", children: "Manage your billing information and tax settings" }),
+        preferencesSuccess && /* @__PURE__ */ jsx("div", { className: "p-4 mb-6 bg-green-50 dark:bg-green-900/20 text-green-800 dark:text-green-200 rounded-lg", children: "Preferences saved successfully" }),
+        /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2", children: "Customer Type" }),
+            /* @__PURE__ */ jsxs("div", { className: "flex gap-4", children: [
+              /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    type: "radio",
+                    name: "customer_type",
+                    value: "individual",
+                    checked: preferencesForm.customer_type === "individual",
+                    onChange: () => setPreferencesForm({ ...preferencesForm, customer_type: "individual" }),
+                    className: "h-4 w-4"
+                  }
+                ),
+                /* @__PURE__ */ jsx("span", { className: "text-sm", children: "Individual" })
+              ] }),
+              /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    type: "radio",
+                    name: "customer_type",
+                    value: "business",
+                    checked: preferencesForm.customer_type === "business",
+                    onChange: () => setPreferencesForm({ ...preferencesForm, customer_type: "business" }),
+                    className: "h-4 w-4"
+                  }
+                ),
+                /* @__PURE__ */ jsx("span", { className: "text-sm", children: "Business" })
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1", children: preferencesForm.customer_type === "business" ? "Contact Name" : "Full Name" }),
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "text",
+                  value: preferencesForm.name,
+                  onChange: (e) => setPreferencesForm({ ...preferencesForm, name: e.target.value }),
+                  className: "w-full px-3 py-2 border border-gray-300 dark:border-neutral-600 rounded-lg bg-white dark:bg-neutral-800 text-gray-900 dark:text-gray-100",
+                  placeholder: "John Doe"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1", children: "Email" }),
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "email",
+                  value: preferencesForm.email,
+                  onChange: (e) => setPreferencesForm({ ...preferencesForm, email: e.target.value }),
+                  className: "w-full px-3 py-2 border border-gray-300 dark:border-neutral-600 rounded-lg bg-white dark:bg-neutral-800 text-gray-900 dark:text-gray-100",
+                  placeholder: "john@example.com"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1", children: "Phone" }),
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "tel",
+                  value: preferencesForm.phone,
+                  onChange: (e) => setPreferencesForm({ ...preferencesForm, phone: e.target.value }),
+                  className: "w-full px-3 py-2 border border-gray-300 dark:border-neutral-600 rounded-lg bg-white dark:bg-neutral-800 text-gray-900 dark:text-gray-100",
+                  placeholder: "+1 555 123 4567"
+                }
+              )
+            ] }),
+            preferencesForm.customer_type === "business" && /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1", children: "Company Name" }),
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "text",
+                  value: preferencesForm.company_name,
+                  onChange: (e) => setPreferencesForm({ ...preferencesForm, company_name: e.target.value }),
+                  className: "w-full px-3 py-2 border border-gray-300 dark:border-neutral-600 rounded-lg bg-white dark:bg-neutral-800 text-gray-900 dark:text-gray-100",
+                  placeholder: "Acme Inc."
+                }
+              )
+            ] })
+          ] }),
+          preferencesForm.customer_type === "business" && /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1", children: "VAT Number" }),
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "text",
+                value: preferencesForm.vat_number,
+                onChange: (e) => setPreferencesForm({ ...preferencesForm, vat_number: e.target.value }),
+                className: "w-full px-3 py-2 border border-gray-300 dark:border-neutral-600 rounded-lg bg-white dark:bg-neutral-800 text-gray-900 dark:text-gray-100",
+                placeholder: "EU123456789"
+              }
+            ),
+            /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-gray-500 dark:text-gray-400", children: "For EU businesses, provide your VAT ID to enable reverse charge" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("h4", { className: "text-sm font-medium text-gray-700 dark:text-gray-300 mb-3", children: "Billing Address" }),
+            /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
+              /* @__PURE__ */ jsxs("div", { className: "md:col-span-2", children: [
+                /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1", children: "Address Line 1" }),
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    type: "text",
+                    value: preferencesForm.address_line1,
+                    onChange: (e) => setPreferencesForm({ ...preferencesForm, address_line1: e.target.value }),
+                    className: "w-full px-3 py-2 border border-gray-300 dark:border-neutral-600 rounded-lg bg-white dark:bg-neutral-800 text-gray-900 dark:text-gray-100",
+                    placeholder: "123 Main Street"
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "md:col-span-2", children: [
+                /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1", children: "Address Line 2" }),
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    type: "text",
+                    value: preferencesForm.address_line2,
+                    onChange: (e) => setPreferencesForm({ ...preferencesForm, address_line2: e.target.value }),
+                    className: "w-full px-3 py-2 border border-gray-300 dark:border-neutral-600 rounded-lg bg-white dark:bg-neutral-800 text-gray-900 dark:text-gray-100",
+                    placeholder: "Apt 4B"
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("div", { children: [
+                /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1", children: "City" }),
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    type: "text",
+                    value: preferencesForm.address_city,
+                    onChange: (e) => setPreferencesForm({ ...preferencesForm, address_city: e.target.value }),
+                    className: "w-full px-3 py-2 border border-gray-300 dark:border-neutral-600 rounded-lg bg-white dark:bg-neutral-800 text-gray-900 dark:text-gray-100",
+                    placeholder: "New York"
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("div", { children: [
+                /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1", children: "State / Region" }),
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    type: "text",
+                    value: preferencesForm.address_state,
+                    onChange: (e) => setPreferencesForm({ ...preferencesForm, address_state: e.target.value }),
+                    className: "w-full px-3 py-2 border border-gray-300 dark:border-neutral-600 rounded-lg bg-white dark:bg-neutral-800 text-gray-900 dark:text-gray-100",
+                    placeholder: "NY"
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("div", { children: [
+                /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1", children: "Postal Code" }),
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    type: "text",
+                    value: preferencesForm.address_postal_code,
+                    onChange: (e) => setPreferencesForm({ ...preferencesForm, address_postal_code: e.target.value }),
+                    className: "w-full px-3 py-2 border border-gray-300 dark:border-neutral-600 rounded-lg bg-white dark:bg-neutral-800 text-gray-900 dark:text-gray-100",
+                    placeholder: "10001"
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("div", { children: [
+                /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1", children: "Country" }),
+                /* @__PURE__ */ jsxs(
+                  "select",
+                  {
+                    value: preferencesForm.address_country,
+                    onChange: (e) => setPreferencesForm({ ...preferencesForm, address_country: e.target.value }),
+                    className: "w-full px-3 py-2 border border-gray-300 dark:border-neutral-600 rounded-lg bg-white dark:bg-neutral-800 text-gray-900 dark:text-gray-100",
+                    children: [
+                      /* @__PURE__ */ jsx("option", { value: "", children: "Select country" }),
+                      /* @__PURE__ */ jsx("option", { value: "US", children: "United States" }),
+                      /* @__PURE__ */ jsx("option", { value: "CA", children: "Canada" }),
+                      /* @__PURE__ */ jsx("option", { value: "GB", children: "United Kingdom" }),
+                      /* @__PURE__ */ jsx("option", { value: "DE", children: "Germany" }),
+                      /* @__PURE__ */ jsx("option", { value: "FR", children: "France" }),
+                      /* @__PURE__ */ jsx("option", { value: "ES", children: "Spain" }),
+                      /* @__PURE__ */ jsx("option", { value: "IT", children: "Italy" }),
+                      /* @__PURE__ */ jsx("option", { value: "NL", children: "Netherlands" }),
+                      /* @__PURE__ */ jsx("option", { value: "BE", children: "Belgium" }),
+                      /* @__PURE__ */ jsx("option", { value: "AT", children: "Austria" }),
+                      /* @__PURE__ */ jsx("option", { value: "CH", children: "Switzerland" }),
+                      /* @__PURE__ */ jsx("option", { value: "SE", children: "Sweden" }),
+                      /* @__PURE__ */ jsx("option", { value: "NO", children: "Norway" }),
+                      /* @__PURE__ */ jsx("option", { value: "DK", children: "Denmark" }),
+                      /* @__PURE__ */ jsx("option", { value: "FI", children: "Finland" }),
+                      /* @__PURE__ */ jsx("option", { value: "IE", children: "Ireland" }),
+                      /* @__PURE__ */ jsx("option", { value: "PT", children: "Portugal" }),
+                      /* @__PURE__ */ jsx("option", { value: "PL", children: "Poland" }),
+                      /* @__PURE__ */ jsx("option", { value: "CZ", children: "Czech Republic" }),
+                      /* @__PURE__ */ jsx("option", { value: "AU", children: "Australia" }),
+                      /* @__PURE__ */ jsx("option", { value: "NZ", children: "New Zealand" }),
+                      /* @__PURE__ */ jsx("option", { value: "SG", children: "Singapore" }),
+                      /* @__PURE__ */ jsx("option", { value: "JP", children: "Japan" }),
+                      /* @__PURE__ */ jsx("option", { value: "KR", children: "South Korea" }),
+                      /* @__PURE__ */ jsx("option", { value: "IN", children: "India" }),
+                      /* @__PURE__ */ jsx("option", { value: "BR", children: "Brazil" }),
+                      /* @__PURE__ */ jsx("option", { value: "MX", children: "Mexico" })
+                    ]
+                  }
+                )
+              ] })
+            ] })
+          ] }),
+          initialTaxInfo && /* @__PURE__ */ jsxs("div", { className: "p-4 bg-gray-50 dark:bg-neutral-800 rounded-lg", children: [
+            /* @__PURE__ */ jsx("h4", { className: "text-sm font-medium text-gray-700 dark:text-gray-300 mb-2", children: "Tax Information" }),
+            /* @__PURE__ */ jsxs("div", { className: "text-sm text-gray-600 dark:text-gray-400", children: [
+              /* @__PURE__ */ jsxs("p", { children: [
+                "Jurisdiction: ",
+                initialTaxInfo.jurisdiction
+              ] }),
+              /* @__PURE__ */ jsxs("p", { children: [
+                "Tax Type: ",
+                initialTaxInfo.tax_label
+              ] }),
+              /* @__PURE__ */ jsxs("p", { children: [
+                "Tax Rate: ",
+                initialTaxInfo.tax_rate,
+                "%"
+              ] }),
+              initialTaxInfo.reverse_charge && /* @__PURE__ */ jsx("p", { className: "text-blue-600 dark:text-blue-400", children: "Reverse charge applies" })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "flex justify-end pt-4 border-t border-gray-200 dark:border-neutral-700", children: /* @__PURE__ */ jsx(
+            Button,
+            {
+              onClick: handleSavePreferences,
+              disabled: preferencesSaving,
+              children: preferencesSaving ? "Saving..." : "Save Preferences"
+            }
+          ) })
+        ] })
+      ] }) })
     }
   ];
   return /* @__PURE__ */ jsxs("div", { className, children: [
@@ -1089,5 +1407,5 @@ function BillingContent({
 }
 
 export { AddPaymentMethodForm, BillingContent, Modal };
-//# sourceMappingURL=chunk-WV3EEYAL.js.map
-//# sourceMappingURL=chunk-WV3EEYAL.js.map
+//# sourceMappingURL=chunk-EJC6ZIK2.js.map
+//# sourceMappingURL=chunk-EJC6ZIK2.js.map