@bunnyapp/components 1.0.53 → 1.0.54

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/cjs/index.js CHANGED
@@ -381,7 +381,7 @@ var InvoiceQuoteView = function (_a) {
381
381
  var _b = react.useContext(InvoiceQuoteContext), shadow = _b.shadow, hideDownloadButton = _b.hideDownloadButton;
382
382
  var isMobile = common.useIsMobile();
383
383
  var buttonsVisible = formattedInvoice && (!hideDownloadButton || onBackButtonClick);
384
- return (jsxRuntime.jsxs("div", __assign({ className: "flex flex-col w-full grow ".concat(isMobile ? "overflow-hidden" : "") }, { children: [buttonsVisible ? (jsxRuntime.jsxs("div", __assign({ className: "flex justify-between items-center pb-4 ".concat(isMobile ? "bunny-shadow-padding-x" : ""), id: "acceptance" }, { children: [jsxRuntime.jsx("div", { children: onBackButtonClick ? (jsxRuntime.jsx(antd.Button, __assign({ className: "text-xs pl-0", onClick: onBackButtonClick, style: {
384
+ return (jsxRuntime.jsxs("div", __assign({ className: "flex flex-col w-full grow ".concat(isMobile ? "overflow-hidden" : "") }, { children: [buttonsVisible ? (jsxRuntime.jsxs("div", __assign({ className: "flex justify-between items-center pb-4 ".concat(isMobile ? "bunny-shadow-padding-x" : ""), id: "acceptance" }, { children: [jsxRuntime.jsx("div", { children: onBackButtonClick ? (jsxRuntime.jsx(antd.Button, __assign({ className: "pl-0", onClick: onBackButtonClick, style: {
385
385
  color: secondaryColor,
386
386
  }, type: "link" }, { children: backButtonName || "Back" }))) : null }), !hideDownloadButton ? (jsxRuntime.jsx(antd.Button, __assign({ icon: jsxRuntime.jsx(icons.DownloadOutlined, {}), onClick: function () {
387
387
  return downloadFile(apiHost + "/api/pdf/invoice/" + formattedInvoice.id, token);
@@ -1576,9 +1576,7 @@ function ActualInvoice() {
1576
1576
  }, [formattedInvoice]);
1577
1577
  if (!formattedInvoice)
1578
1578
  return jsxRuntime.jsx(jsxRuntime.Fragment, {});
1579
- return (jsxRuntime.jsx("div", __assign({ className: "bunny-invoice-container" }, { children: jsxRuntime.jsxs("div", __assign({ className: "flex gap-6 ".concat(isMobile
1580
- ? "flex-col w-full overflow-hidden"
1581
- : "bunny-shadow-padding-xb", " ").concat(className) }, { children: [formattedInvoice.isLegacy ? (jsxRuntime.jsx("div", __assign({ className: "flex justify-center w-full" }, { children: jsxRuntime.jsx(InvoicePDF, { invoiceUuid: formattedInvoice.uuid, apiHost: apiHost, token: token }) }))) : (invoiceQuoteViewComponent || (jsxRuntime.jsx(InvoiceQuoteView, { html: formattedInvoice.html, formattedInvoice: formattedInvoice, backButtonName: backButtonName, onBackButtonClick: onBackButtonClick }))), isInvoicePayable && (jsxRuntime.jsx("div", __assign({ className: "w-full ".concat(hideDownloadButton || formattedInvoice.isLegacy ? "" : "pt-12") }, { children: jsxRuntime.jsx(PaymentForm, { onPaymentSuccess: onSuccess, onFail: onFail, invoice: formattedInvoice, graphQLClient: graphQLClient }) })))] })) })));
1579
+ return (jsxRuntime.jsx("div", __assign({ className: "bunny-invoice-container" }, { children: jsxRuntime.jsxs("div", __assign({ className: "flex gap-6 ".concat(isMobile ? "flex-col w-full overflow-hidden" : "", " ").concat(className) }, { children: [formattedInvoice.isLegacy ? (jsxRuntime.jsx("div", __assign({ className: "flex justify-center w-full" }, { children: jsxRuntime.jsx(InvoicePDF, { invoiceUuid: formattedInvoice.uuid, apiHost: apiHost, token: token }) }))) : (invoiceQuoteViewComponent || (jsxRuntime.jsx(InvoiceQuoteView, { html: formattedInvoice.html, formattedInvoice: formattedInvoice, backButtonName: backButtonName, onBackButtonClick: onBackButtonClick }))), isInvoicePayable && (jsxRuntime.jsx("div", __assign({ className: "w-full ".concat(hideDownloadButton || formattedInvoice.isLegacy ? "" : "pt-12") }, { children: jsxRuntime.jsx(PaymentForm, { onPaymentSuccess: onSuccess, onFail: onFail, invoice: formattedInvoice, graphQLClient: graphQLClient }) })))] })) })));
1582
1580
  }
1583
1581
 
1584
1582
  var MUTATION$7 = function (id) { return "\n query formattedQuote ($id: ID) {\n formattedQuote (id: $id) {\n payableId\n acceptedAt\n acceptedByName\n amount\n amountDue\n amountsByPeriod {\n id\n name\n amount\n }\n object { documents { id filename size date url } }\n billingCity\n billingCountry\n billingState\n billingStreet\n billingZip\n contactName\n currency\n customerBillingCity\n customerBillingCountry\n customerBillingState\n customerBillingStreet\n customerBillingZip\n customerName\n discount\n discountValue\n duration\n endDate\n expiresAt\n html\n formattedLines {\n amount\n amountsByPeriod {\n quantity\n id\n name\n startDate\n endDate\n amount\n amountsByTier {\n id\n tier {\n starts\n ends\n price\n }\n quantity\n amount\n }\n prorationRate\n }\n billingPeriodEnd\n billingPeriodStart\n chargeType\n discount\n frequency\n isRamp\n periods\n planName\n position\n price\n priceDecimals\n priceListChargeId\n priceListChargeName\n priceListId\n priceListName\n priceTiers {\n price\n starts\n }\n pricingModel\n productName\n prorationRate\n quantity\n showProductNameOnLineItem\n taxCode\n trialEndDate\n trialStartDate\n unitOfMeasure\n vatCode\n }\n netPaymentDays\n notes\n number\n poNumberRequired\n salesContactEmail\n sharedAt\n startDate\n state\n subtotal\n taxAmount\n taxNumberLabel\n taxNumberRequired\n vendorName\n }\n }"; };
@@ -20255,6 +20253,35 @@ var PaymentFormWrapper = function (_a) {
20255
20253
  })) }, { children: children })));
20256
20254
  };
20257
20255
 
20256
+ var useCurrentUserData = function () {
20257
+ var queryClient = reactQuery.useQueryClient();
20258
+ var token = useToken();
20259
+ var currentUser = queryClient.getQueryData(common.QueryKeyFactory.default.currentUserKey(token));
20260
+ if (!currentUser)
20261
+ return {};
20262
+ return currentUser;
20263
+ };
20264
+
20265
+ var BunnyFooterIcon = function (_a) {
20266
+ var color = _a.color;
20267
+ return (jsxRuntime.jsxs("svg", __assign({ width: "45", height: "15", viewBox: "0 0 39 13", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsxRuntime.jsxs("g", __assign({ clipPath: "url(#clip0_6_851)" }, { children: [jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M14.5898 7.19708C14.5898 9.35053 13.0926 10.325 11.2495 10.325C9.39955 10.325 7.90234 9.35001 7.90234 7.18967V3.26221H10.1125V7.00052C10.1125 7.87719 10.5855 8.27725 11.2495 8.27725C11.9061 8.27725 12.3865 7.87719 12.3865 7.00052V3.26221H14.5898V7.19708Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M31.8943 12.9625H29.4793L31.8523 8.62816L28.9355 3.26221H31.4708L33.0457 6.35524L34.5924 3.26221H37.0075L31.8943 12.9625Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M15.1602 5.96827C15.1602 3.8148 16.6574 2.84033 18.5005 2.84033C20.3504 2.84033 21.8476 3.81533 21.8476 5.97568V10.1473H19.6374V6.16483C19.6374 5.28815 19.1645 4.8881 18.5005 4.8881C17.8439 4.8881 17.3634 5.28815 17.3634 6.16483V10.1473H15.1602V5.96827Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M22.4316 5.96827C22.4316 3.8148 23.9289 2.84033 25.7719 2.84033C27.6219 2.84033 29.1191 3.81533 29.1191 5.97568V10.1473H26.9089V6.16483C26.9089 5.28815 26.4359 4.8881 25.7719 4.8881C25.1154 4.8881 24.6349 5.28815 24.6349 6.16483V10.1473H22.4316V5.96827Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M7.40511 6.68957C7.40511 8.7236 6.02815 10.3227 4.17816 10.3227C3.23907 10.3227 2.61071 9.94378 2.19358 9.40371V10.1404H0.0605469V0.0405273H2.26381V3.91939C2.68041 3.42158 3.28802 3.07069 4.17763 3.07069C6.02759 3.07069 7.40511 4.66981 7.40511 6.68957ZM2.17229 6.69642C2.17229 7.60802 2.77937 8.2744 3.64823 8.2744C4.53783 8.2744 5.13107 7.59372 5.13107 6.69642C5.13107 5.79912 4.53783 5.11844 3.64823 5.11844C2.77937 5.11844 2.17229 5.78482 2.17229 6.69642Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M38.966 8.94801C38.966 9.76181 38.2668 10.4631 37.4618 10.4631C36.6499 10.4631 35.9434 9.76181 35.9434 8.94801C35.9434 8.14846 36.6494 7.46094 37.4618 7.46094C38.2668 7.46094 38.966 8.14846 38.966 8.94801Z", fill: color })] })), jsxRuntime.jsx("defs", { children: jsxRuntime.jsx("clipPath", __assign({ id: "clip0_6_851" }, { children: jsxRuntime.jsx("rect", { width: "39", height: "13", fill: "white" }) })) })] })));
20268
+ };
20269
+
20270
+ var Footer = function (_a) {
20271
+ var className = _a.className;
20272
+ var _b = useCurrentUserData(), privacyUrl = _b.privacyUrl, termsUrl = _b.termsUrl;
20273
+ var isMobile = common.useIsMobile();
20274
+ return (jsxRuntime.jsxs("div", __assign({ className: "flex items-center justify-between shrink-0 ".concat(isMobile ? "flex-col gap-2 grow" : "", " ").concat(className) }, { children: [(termsUrl || privacyUrl) && (jsxRuntime.jsxs("div", __assign({ className: "flex items-center gap-3" }, { children: [termsUrl && (jsxRuntime.jsx(StyedLink, __assign({ className: "text-xs text-slate-400", href: termsUrl, rel: "noopener noreferrer", target: "_blank", type: "text" }, { children: "Terms" }))), privacyUrl && (jsxRuntime.jsx(StyedLink, __assign({ className: "text-xs text-slate-400", href: privacyUrl, rel: "noopener noreferrer", target: "_blank", type: "text" }, { children: "Privacy" })))] }))), jsxRuntime.jsx(BunnyMarketingLink, {})] })));
20275
+ };
20276
+ var BunnyMarketingLink = function () {
20277
+ var _a = react.useState(false), isHovered = _a[0], setIsHovered = _a[1];
20278
+ var isMobile = common.useIsMobile();
20279
+ return (jsxRuntime.jsx("div", __assign({ className: "flex items-end justify-end ".concat(isMobile ? "" : "grow") }, { children: jsxRuntime.jsx(StyledBunnyLink, __assign({ className: "flex items-end justify-end text-slate-400", href: "https://bunny.com/", rel: "noopener noreferrer", target: "_blank" }, { children: jsxRuntime.jsxs("div", __assign({ className: "flex items-center", onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); } }, { children: ["Powered by\u00A0", jsxRuntime.jsx("div", __assign({ style: { paddingTop: "5px" } }, { children: jsxRuntime.jsx(BunnyFooterIcon, { color: isHovered ? common.PRIMARY_COLOR : common.SLATE_400 }) }))] })) })) })));
20280
+ };
20281
+ var StyedLink = styled__default["default"].a(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n font-family: Inter;\n text-decoration: none;\n font-size: 14px;\n"], ["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n font-family: Inter;\n text-decoration: none;\n font-size: 14px;\n"])), common.SLATE_400, common.SLATE_500);
20282
+ var StyledBunnyLink = styled__default["default"](StyedLink)(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n &:hover {\n color: ", " !important;\n }\n"], ["\n &:hover {\n color: ", " !important;\n }\n"])), common.PRIMARY_COLOR);
20283
+ var templateObject_1$5, templateObject_2$1;
20284
+
20258
20285
  var queryKeyFactory = common.QueryKeyFactory.default;
20259
20286
  var Checkout = function (_a) {
20260
20287
  var _b, _c;
@@ -20334,45 +20361,9 @@ var Checkout = function (_a) {
20334
20361
  onFail(error);
20335
20362
  }, onSuccess: onSuccess, quote: quote, taxationRequiredAccountFields: taxationRequiredAccountFields, token: token })) : (jsxRuntime.jsx(PaymentForm, { onFail: function (error) {
20336
20363
  onFail(error);
20337
- }, onPaymentSuccess: onSuccess, graphQLClient: graphQLClient }))] }))] })) })));
20364
+ }, onPaymentSuccess: onSuccess, graphQLClient: graphQLClient }))] })), jsxRuntime.jsx(Footer, {})] })) })));
20338
20365
  };
20339
20366
 
20340
- var useCurrentUserData = function () {
20341
- var queryClient = reactQuery.useQueryClient();
20342
- var token = useToken();
20343
- var currentUser = queryClient.getQueryData(common.QueryKeyFactory.default.currentUserKey(token));
20344
- if (!currentUser)
20345
- return {};
20346
- return currentUser;
20347
- };
20348
-
20349
- var BunnyFooterIcon = function (_a) {
20350
- var color = _a.color;
20351
- return (jsxRuntime.jsxs("svg", __assign({ width: "45", height: "15", viewBox: "0 0 39 13", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsxRuntime.jsxs("g", __assign({ clipPath: "url(#clip0_6_851)" }, { children: [jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M14.5898 7.19708C14.5898 9.35053 13.0926 10.325 11.2495 10.325C9.39955 10.325 7.90234 9.35001 7.90234 7.18967V3.26221H10.1125V7.00052C10.1125 7.87719 10.5855 8.27725 11.2495 8.27725C11.9061 8.27725 12.3865 7.87719 12.3865 7.00052V3.26221H14.5898V7.19708Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M31.8943 12.9625H29.4793L31.8523 8.62816L28.9355 3.26221H31.4708L33.0457 6.35524L34.5924 3.26221H37.0075L31.8943 12.9625Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M15.1602 5.96827C15.1602 3.8148 16.6574 2.84033 18.5005 2.84033C20.3504 2.84033 21.8476 3.81533 21.8476 5.97568V10.1473H19.6374V6.16483C19.6374 5.28815 19.1645 4.8881 18.5005 4.8881C17.8439 4.8881 17.3634 5.28815 17.3634 6.16483V10.1473H15.1602V5.96827Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M22.4316 5.96827C22.4316 3.8148 23.9289 2.84033 25.7719 2.84033C27.6219 2.84033 29.1191 3.81533 29.1191 5.97568V10.1473H26.9089V6.16483C26.9089 5.28815 26.4359 4.8881 25.7719 4.8881C25.1154 4.8881 24.6349 5.28815 24.6349 6.16483V10.1473H22.4316V5.96827Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M7.40511 6.68957C7.40511 8.7236 6.02815 10.3227 4.17816 10.3227C3.23907 10.3227 2.61071 9.94378 2.19358 9.40371V10.1404H0.0605469V0.0405273H2.26381V3.91939C2.68041 3.42158 3.28802 3.07069 4.17763 3.07069C6.02759 3.07069 7.40511 4.66981 7.40511 6.68957ZM2.17229 6.69642C2.17229 7.60802 2.77937 8.2744 3.64823 8.2744C4.53783 8.2744 5.13107 7.59372 5.13107 6.69642C5.13107 5.79912 4.53783 5.11844 3.64823 5.11844C2.77937 5.11844 2.17229 5.78482 2.17229 6.69642Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M38.966 8.94801C38.966 9.76181 38.2668 10.4631 37.4618 10.4631C36.6499 10.4631 35.9434 9.76181 35.9434 8.94801C35.9434 8.14846 36.6494 7.46094 37.4618 7.46094C38.2668 7.46094 38.966 8.14846 38.966 8.94801Z", fill: color })] })), jsxRuntime.jsx("defs", { children: jsxRuntime.jsx("clipPath", __assign({ id: "clip0_6_851" }, { children: jsxRuntime.jsx("rect", { width: "39", height: "13", fill: "white" }) })) })] })));
20352
- };
20353
-
20354
- var SubscriptionsContext = react.createContext({});
20355
-
20356
- var Footer = function (_a) {
20357
- var className = _a.className;
20358
- // Context
20359
- var quotePreviewData = react.useContext(SubscriptionsContext).quotePreviewData;
20360
- var _b = useCurrentUserData(), privacyUrl = _b.privacyUrl, termsUrl = _b.termsUrl;
20361
- var isMobile = common.useIsMobile();
20362
- var selectedPriceList = quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.priceList;
20363
- if (selectedPriceList && isMobile)
20364
- return null;
20365
- return (jsxRuntime.jsxs("div", __assign({ className: "flex items-center justify-between shrink-0 ".concat(isMobile ? "flex-col gap-2 grow" : "", " ").concat(className) }, { children: [(termsUrl || privacyUrl) && (jsxRuntime.jsxs("div", __assign({ className: "flex items-center gap-3" }, { children: [termsUrl && (jsxRuntime.jsx(StyedLink, __assign({ className: "text-xs text-slate-400", href: termsUrl, rel: "noopener noreferrer", target: "_blank", type: "text" }, { children: "Terms" }))), privacyUrl && (jsxRuntime.jsx(StyedLink, __assign({ className: "text-xs text-slate-400", href: privacyUrl, rel: "noopener noreferrer", target: "_blank", type: "text" }, { children: "Privacy" })))] }))), jsxRuntime.jsx(BunnyMarketingLink, {})] })));
20366
- };
20367
- var BunnyMarketingLink = function () {
20368
- var _a = react.useState(false), isHovered = _a[0], setIsHovered = _a[1];
20369
- var isMobile = common.useIsMobile();
20370
- return (jsxRuntime.jsx("div", __assign({ className: "flex items-end justify-end ".concat(isMobile ? "" : "grow") }, { children: jsxRuntime.jsx(StyledBunnyLink, __assign({ className: "flex items-end justify-end text-slate-400", href: "https://bunny.com/", rel: "noopener noreferrer", target: "_blank" }, { children: jsxRuntime.jsxs("div", __assign({ className: "flex items-center", onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); } }, { children: ["Powered by\u00A0", jsxRuntime.jsx("div", __assign({ style: { paddingTop: "5px" } }, { children: jsxRuntime.jsx(BunnyFooterIcon, { color: isHovered ? common.PRIMARY_COLOR : common.SLATE_400 }) }))] })) })) })));
20371
- };
20372
- var StyedLink = styled__default["default"].a(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n font-family: Inter;\n text-decoration: none;\n font-size: 14px;\n"], ["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n font-family: Inter;\n text-decoration: none;\n font-size: 14px;\n"])), common.SLATE_400, common.SLATE_500);
20373
- var StyledBunnyLink = styled__default["default"](StyedLink)(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n &:hover {\n color: ", " !important;\n }\n"], ["\n &:hover {\n color: ", " !important;\n }\n"])), common.PRIMARY_COLOR);
20374
- var templateObject_1$5, templateObject_2$1;
20375
-
20376
20367
  var PageTitle = function (_a) {
20377
20368
  var onGoBack = _a.onGoBack, title = _a.title;
20378
20369
  var isMobile = common.useIsMobile();
@@ -20387,6 +20378,8 @@ var PageTitle = function (_a) {
20387
20378
  } })), title] })));
20388
20379
  };
20389
20380
 
20381
+ var SubscriptionsContext = react.createContext({});
20382
+
20390
20383
  var calculateNewQuantity = function (priceList, currentQuantity) {
20391
20384
  if (currentQuantity === void 0) { currentQuantity = 1; }
20392
20385
  var priceListRecurringCharge = priceList === null || priceList === void 0 ? void 0 : priceList.charges.find(function (priceListCharge) {
@@ -20772,7 +20765,7 @@ var getPriceListChangeOptions = function (_a) {
20772
20765
  })];
20773
20766
  case 1:
20774
20767
  response = _b.sent();
20775
- priceListChangeOptions = response;
20768
+ priceListChangeOptions = response.priceListChangeOptions;
20776
20769
  if (priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.errors)
20777
20770
  throw priceListChangeOptions.errors;
20778
20771
  // Sort planChangeOptions.plans by position
@@ -21135,17 +21128,17 @@ var PriceListGridDesktop = function (_a) {
21135
21128
  });
21136
21129
  }, [availablePriceLists, priceListChangeOptions, priceListStart]), availablePlansArray = _b.availablePlansArray, displayPriceLists = _b.displayPriceLists;
21137
21130
  var everythingInPlus = selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.everythingInPlus;
21138
- return (jsxRuntime.jsx("div", __assign({ className: "shadow-padding-xb" }, { children: jsxRuntime.jsxs("div", __assign({ className: "relative flex flex-col h-full rounded-md shadow overflow-hidden bg-white" }, { children: [jsxRuntime.jsx(NextPriceListButton, { availablePriceLists: availablePriceLists, priceListStart: priceListStart, setPriceListStart: setPriceListStart }), jsxRuntime.jsxs("div", __assign({ className: "grid w-full", style: {
21139
- gridTemplateColumns: everythingInPlus
21140
- ? "repeat(3, minmax(120px, 1fr))"
21141
- : "minmax(auto, 400px) repeat(3, minmax(120px, 1fr))",
21142
- } }, { children: [!everythingInPlus && jsxRuntime.jsx(PlanPickerGridCell, { noBorder: true }), __spreadArray([], Array(PLANS_TO_DISPLAY), true).map(function (_, index) {
21143
- var priceList = displayPriceLists[index];
21144
- var doesPrevPriceListExist = displayPriceLists[index - 1];
21145
- if (!priceList)
21146
- return jsxRuntime.jsx(PlanPickerGridCell, { noBorder: !Boolean(doesPrevPriceListExist) }, index);
21147
- return (jsxRuntime.jsx(PriceListCard, { isSelected: priceList.plan.id === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.plan.id), onClick: onChangePriceList, priceList: priceList, subscriptions: subscriptions, trialRemainingDays: trialRemainingDays }, index));
21148
- }), (selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.everythingInPlus) ? (jsxRuntime.jsx(EverythingPlanFeatures, { availablePriceLists: availablePriceLists, selectedProduct: selectedProduct })) : (jsxRuntime.jsx(PlanFeatures, { availablePlansArray: availablePlansArray, selectedProduct: selectedProduct }))] }))] })) })));
21131
+ return (jsxRuntime.jsxs("div", __assign({ className: "relative flex flex-col rounded-md shadow overflow-hidden bg-white" }, { children: [jsxRuntime.jsx(NextPriceListButton, { availablePriceLists: availablePriceLists, priceListStart: priceListStart, setPriceListStart: setPriceListStart }), jsxRuntime.jsxs("div", __assign({ className: "grid w-full", style: {
21132
+ gridTemplateColumns: everythingInPlus
21133
+ ? "repeat(3, minmax(120px, 1fr))"
21134
+ : "minmax(auto, 400px) repeat(3, minmax(120px, 1fr))",
21135
+ } }, { children: [!everythingInPlus && jsxRuntime.jsx(PlanPickerGridCell, { noBorder: true }), __spreadArray([], Array(PLANS_TO_DISPLAY), true).map(function (_, index) {
21136
+ var priceList = displayPriceLists[index];
21137
+ var doesPrevPriceListExist = displayPriceLists[index - 1];
21138
+ if (!priceList)
21139
+ return (jsxRuntime.jsx(PlanPickerGridCell, { noBorder: !Boolean(doesPrevPriceListExist) }, index));
21140
+ return (jsxRuntime.jsx(PriceListCard, { isSelected: priceList.plan.id === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.plan.id), onClick: onChangePriceList, priceList: priceList, subscriptions: subscriptions, trialRemainingDays: trialRemainingDays }, index));
21141
+ }), (selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.everythingInPlus) ? (jsxRuntime.jsx(EverythingPlanFeatures, { availablePriceLists: availablePriceLists, selectedProduct: selectedProduct })) : (jsxRuntime.jsx(PlanFeatures, { availablePlansArray: availablePlansArray, selectedProduct: selectedProduct }))] }))] })));
21149
21142
  };
21150
21143
 
21151
21144
  var PriceListGrid = function (_a) {
@@ -21388,16 +21381,25 @@ var PlanManager = function (_a) {
21388
21381
  token: token,
21389
21382
  }),
21390
21383
  queryFn: function () {
21391
- return (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id) ? getQuote({ token: token, id: editingQuoteData.id, apiHost: apiHost }) : undefined;
21384
+ return (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id)
21385
+ ? getQuote({ token: token, id: editingQuoteData.id, apiHost: apiHost })
21386
+ : undefined;
21392
21387
  },
21393
21388
  enabled: Boolean(editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id),
21394
21389
  }).data;
21395
21390
  react.useEffect(function () {
21396
21391
  if (subscriptionUpgradeId && !upgradingSubscription) {
21397
- var subscription = subscriptions === null || subscriptions === void 0 ? void 0 : subscriptions.find(function (subscription) { return subscription.id === subscriptionUpgradeId; });
21392
+ var subscription = subscriptions === null || subscriptions === void 0 ? void 0 : subscriptions.find(function (subscription) {
21393
+ return subscription.id === subscriptionUpgradeId;
21394
+ });
21398
21395
  setUpgradingSubscription(subscription);
21399
21396
  }
21400
- }, [setUpgradingSubscription, subscriptionUpgradeId, subscriptions, upgradingSubscription]);
21397
+ }, [
21398
+ setUpgradingSubscription,
21399
+ subscriptionUpgradeId,
21400
+ subscriptions,
21401
+ upgradingSubscription,
21402
+ ]);
21401
21403
  react.useEffect(function () {
21402
21404
  var observer = new IntersectionObserver(function (_a) {
21403
21405
  var entry = _a[0];
@@ -21445,7 +21447,7 @@ var PlanManager = function (_a) {
21445
21447
  return showInfoNotification("You are in preview mode");
21446
21448
  setQuotePreviewData(undefined);
21447
21449
  onChangePlanCancel();
21448
- }, title: "Change plan" }), jsxRuntime.jsx(PlanPicker, {}), jsxRuntime.jsx(Checkout, { onCancel: onCancel, onSuccess: onSuccess, onFail: onFail, open: payModalVisible, quote: quote, token: token, isMobile: isMobile, storedPaymentMethod: storedPaymentMethod, selectedPriceList: quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.priceList, quantity: quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.quantity }), jsxRuntime.jsx("div", { ref: stickyRef }), jsxRuntime.jsx("div", __assign({ className: "sticky bottom-4 transition-[margin] duration-300 ".concat(isSticky ? "mx-4" : "mx-0") }, { children: jsxRuntime.jsx(PlanPickerCheckoutBarWrapper, { handlePortalErrors: handlePortalErrors, onCheckoutSuccess: function () { return onChangePlanCancel(); } }) })), jsxRuntime.jsx(Footer, {})] })));
21450
+ }, title: "Change plan" }), jsxRuntime.jsx(PlanPicker, {}), jsxRuntime.jsx(Checkout, { onCancel: onCancel, onSuccess: onSuccess, onFail: onFail, open: payModalVisible, quote: quote, token: token, isMobile: isMobile, storedPaymentMethod: storedPaymentMethod, selectedPriceList: quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.priceList, quantity: quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.quantity }), jsxRuntime.jsx("div", { ref: stickyRef }), jsxRuntime.jsx("div", __assign({ className: "sticky bottom-4 transition-[margin] duration-300 ".concat(isSticky ? "mx-4" : "mx-0") }, { children: jsxRuntime.jsx(PlanPickerCheckoutBarWrapper, { handlePortalErrors: handlePortalErrors, onCheckoutSuccess: function () { return onChangePlanCancel(); } }) }))] })));
21449
21451
  };
21450
21452
 
21451
21453
  var useCancelSubscription = function () {
@@ -22294,7 +22296,9 @@ var Subscriptions = function (_a) {
22294
22296
  token: token,
22295
22297
  }),
22296
22298
  queryFn: function () {
22297
- return (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id) ? getQuote({ token: token, id: editingQuoteData.id, apiHost: apiHost }) : undefined;
22299
+ return (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id)
22300
+ ? getQuote({ token: token, id: editingQuoteData.id, apiHost: apiHost })
22301
+ : undefined;
22298
22302
  },
22299
22303
  enabled: Boolean(editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id),
22300
22304
  }).data;
@@ -22390,7 +22394,7 @@ var Subscriptions = function (_a) {
22390
22394
  setIsChangingPlan(false);
22391
22395
  }, handlePortalErrors: handlePortalErrors }));
22392
22396
  }
22393
- return (jsxRuntime.jsxs("div", __assign({ className: "".concat(className) }, { children: [!hideTitle ? jsxRuntime.jsx(PageTitle, { title: "Subscriptions" }) : null, jsxRuntime.jsx(PageHeaderWithActions, __assign({ title: jsxRuntime.jsxs(Text$1, __assign({ className: "flex items-center justify-between", style: { minWidth: "137px" } }, { children: [hideExpired ? "Active subscriptions" : "All subscriptions", isMobile && (jsxRuntime.jsx(HideExpiredToggle, { hideExpired: hideExpired, setHideExpired: setHideExpired, visible: expiredSwitchVisible }))] })) }, { children: !isMobile && (jsxRuntime.jsx(SubscriptionsNavigation, { expiredSwitchVisible: expiredSwitchVisible, hideExpired: hideExpired, setHideExpired: setHideExpired, setQuantityDrawerOpen: setQuantityDrawerOpen, subscriptions: subscriptions })) })), jsxRuntime.jsx(SubscriptionsListContainer, { companyName: companyName, hideExpired: hideExpired, onCancelSubscriptionClick: onCancelSubscriptionClick, onChangePlanClick: onChangePlanClick, subscriptions: subscriptions, subscriptionsAreLoading: subscriptionsAreLoading, noSubscriptionsComponent: noSubscriptionsComponent }), isMobile && (jsxRuntime.jsx("div", __assign({ className: "pt-4 pb-2" }, { children: jsxRuntime.jsx(SubscriptionsNavigation, { expiredSwitchVisible: expiredSwitchVisible, hideExpired: hideExpired, setHideExpired: setHideExpired, setQuantityDrawerOpen: setQuantityDrawerOpen, subscriptions: subscriptions }) }))), jsxRuntime.jsx(Footer, {}), jsxRuntime.jsx(QuantityChangeDrawerDesktop, { editingQuote: quote, editingQuoteData: editingQuoteData, onClose: onClose, open: quantityDrawerOpen, openCheckout: function () { return setPayModalVisible(true); }, setEditingQuoteData: setEditingQuoteData, subscriptions: subscriptions }), jsxRuntime.jsx(Checkout, { onCancel: onCancel, onSuccess: onSuccess, onFail: onFail, open: payModalVisible, quote: quote, token: token, isMobile: isMobile, storedPaymentMethod: storedPaymentMethod })] })));
22397
+ return (jsxRuntime.jsxs("div", __assign({ className: "".concat(className) }, { children: [!hideTitle ? jsxRuntime.jsx(PageTitle, { title: "Subscriptions" }) : null, jsxRuntime.jsx(PageHeaderWithActions, __assign({ title: jsxRuntime.jsxs(Text$1, __assign({ className: "flex items-center justify-between", style: { minWidth: "137px" } }, { children: [hideExpired ? "Active subscriptions" : "All subscriptions", isMobile && (jsxRuntime.jsx(HideExpiredToggle, { hideExpired: hideExpired, setHideExpired: setHideExpired, visible: expiredSwitchVisible }))] })) }, { children: !isMobile && (jsxRuntime.jsx(SubscriptionsNavigation, { expiredSwitchVisible: expiredSwitchVisible, hideExpired: hideExpired, setHideExpired: setHideExpired, setQuantityDrawerOpen: setQuantityDrawerOpen, subscriptions: subscriptions })) })), jsxRuntime.jsx(SubscriptionsListContainer, { companyName: companyName, hideExpired: hideExpired, onCancelSubscriptionClick: onCancelSubscriptionClick, onChangePlanClick: onChangePlanClick, subscriptions: subscriptions, subscriptionsAreLoading: subscriptionsAreLoading, noSubscriptionsComponent: noSubscriptionsComponent }), isMobile && (jsxRuntime.jsx("div", __assign({ className: "pt-4 pb-2" }, { children: jsxRuntime.jsx(SubscriptionsNavigation, { expiredSwitchVisible: expiredSwitchVisible, hideExpired: hideExpired, setHideExpired: setHideExpired, setQuantityDrawerOpen: setQuantityDrawerOpen, subscriptions: subscriptions }) }))), jsxRuntime.jsx(QuantityChangeDrawerDesktop, { editingQuote: quote, editingQuoteData: editingQuoteData, onClose: onClose, open: quantityDrawerOpen, openCheckout: function () { return setPayModalVisible(true); }, setEditingQuoteData: setEditingQuoteData, subscriptions: subscriptions }), jsxRuntime.jsx(Checkout, { onCancel: onCancel, onSuccess: onSuccess, onFail: onFail, open: payModalVisible, quote: quote, token: token, isMobile: isMobile, storedPaymentMethod: storedPaymentMethod })] })));
22394
22398
  };
22395
22399
  var PageHeaderWithActions = function (_a) {
22396
22400
  var children = _a.children, title = _a.title;
@@ -22625,6 +22629,7 @@ var PaymentFormSection = function (_a) {
22625
22629
 
22626
22630
  exports.BillingDetails = BillingDetails;
22627
22631
  exports.BunnyProvider = BunnyProvider;
22632
+ exports.Footer = Footer;
22628
22633
  exports.Invoice = Invoice;
22629
22634
  exports.PaymentForm = PaymentForm;
22630
22635
  exports.PaymentMethod = PaymentMethod;
@@ -1,4 +1,4 @@
1
1
  declare const Footer: ({ className }: {
2
2
  className?: string | undefined;
3
- }) => import("react/jsx-runtime").JSX.Element | null;
3
+ }) => import("react/jsx-runtime").JSX.Element;
4
4
  export default Footer;
@@ -0,0 +1 @@
1
+ export { default as Footer } from "./Footer";
@@ -11,7 +11,7 @@ declare const SubscriptionsWrapper: ({ handlePortalErrors, companyName, isInPrev
11
11
  className?: string | undefined;
12
12
  styles?: {
13
13
  gap?: number | undefined;
14
- shadow?: "none" | "sm" | "md" | "lg" | undefined;
14
+ shadow?: "none" | "lg" | "md" | "sm" | undefined;
15
15
  subscriptionProductNameStyle?: import("react").CSSProperties | undefined;
16
16
  } | undefined;
17
17
  noSubscriptionsComponent?: React.ReactNode;
@@ -7,3 +7,4 @@ export { default as BunnyProvider } from "./BunnyProvider";
7
7
  export { default as Transactions } from "./Transactions";
8
8
  export { Subscriptions } from "./Subscriptions";
9
9
  export { BillingDetails } from "./BillingDetails";
10
+ export { Footer } from "./Footer";
package/dist/esm/index.js CHANGED
@@ -4,7 +4,7 @@ import { Markup } from 'interweave';
4
4
  import { ConfigProvider, Button, Tag, Typography, Divider, Popconfirm, Input, Checkbox, Collapse, Skeleton, Modal, Form, Drawer, Card as Card$1, Image, Select, Tooltip, Radio, Space, Dropdown } from 'antd';
5
5
  import { DownloadOutlined, CreditCardOutlined, BankOutlined, SearchOutlined, CloseOutlined, CheckCircleFilled, ArrowLeftOutlined } from '@ant-design/icons';
6
6
  import styled from 'styled-components';
7
- import { DEFAULT_ACCENT_COLOR, DEFAULT_BRAND_COLOR, DEFAULT_SECONDARY_COLOR, DEFAULT_TOP_NAV_IMAGE_URL, gqlRequest, QueryKeyFactory, useIsMobile, isColorTooDark, MARK_PRO, INPUT_BORDER_COLOR, SLATE_50, SLATE_400, SLATE_200, getPlugins, useAllErrorFormats, formatCurrency, invokePlugin, GRAY_500, GRAY_200, useErrorNotification, useSuccessNotification, getFormattedInvoice, PAYABLE_INVOICE_STATES, BreakpointNumbers, useGraphQLmutation, formatDate, FrontendTransaction, SLATE_600, WHITE, TransactionKind, sortSubscriptionCharges, Lists, getAccount, SLATE_500, PRIMARY_COLOR, StringUtils, BillingPeriod, ChargeType, SubscriptionState as SubscriptionState$2, PERIOD_LABELS, PricingStyle, PricingModel, SLATE_100, useInfoNotification, MODAL_MAX_HEIGHT, DataInterval, TAG_COLORS, SubscriptionChargeKind } from '@bunnyapp/common';
7
+ import { DEFAULT_ACCENT_COLOR, DEFAULT_BRAND_COLOR, DEFAULT_SECONDARY_COLOR, DEFAULT_TOP_NAV_IMAGE_URL, gqlRequest, QueryKeyFactory, useIsMobile, isColorTooDark, MARK_PRO, INPUT_BORDER_COLOR, SLATE_50, SLATE_400, SLATE_200, getPlugins, useAllErrorFormats, formatCurrency, invokePlugin, GRAY_500, GRAY_200, useErrorNotification, useSuccessNotification, getFormattedInvoice, PAYABLE_INVOICE_STATES, BreakpointNumbers, useGraphQLmutation, formatDate, FrontendTransaction, SLATE_600, WHITE, TransactionKind, sortSubscriptionCharges, Lists, SLATE_500, PRIMARY_COLOR, getAccount, StringUtils, BillingPeriod, ChargeType, SubscriptionState as SubscriptionState$2, PERIOD_LABELS, PricingStyle, PricingModel, SLATE_100, useInfoNotification, MODAL_MAX_HEIGHT, DataInterval, TAG_COLORS, SubscriptionChargeKind } from '@bunnyapp/common';
8
8
  import { QueryClient, QueryClientProvider, useQuery, useQueryClient, keepPreviousData, useMutation } from '@tanstack/react-query';
9
9
  import theme from 'antd/lib/theme/index.js';
10
10
  import { RecoilRoot } from 'recoil';
@@ -352,7 +352,7 @@ var InvoiceQuoteView = function (_a) {
352
352
  var _b = useContext(InvoiceQuoteContext), shadow = _b.shadow, hideDownloadButton = _b.hideDownloadButton;
353
353
  var isMobile = useIsMobile();
354
354
  var buttonsVisible = formattedInvoice && (!hideDownloadButton || onBackButtonClick);
355
- return (jsxs("div", __assign({ className: "flex flex-col w-full grow ".concat(isMobile ? "overflow-hidden" : "") }, { children: [buttonsVisible ? (jsxs("div", __assign({ className: "flex justify-between items-center pb-4 ".concat(isMobile ? "bunny-shadow-padding-x" : ""), id: "acceptance" }, { children: [jsx("div", { children: onBackButtonClick ? (jsx(Button, __assign({ className: "text-xs pl-0", onClick: onBackButtonClick, style: {
355
+ return (jsxs("div", __assign({ className: "flex flex-col w-full grow ".concat(isMobile ? "overflow-hidden" : "") }, { children: [buttonsVisible ? (jsxs("div", __assign({ className: "flex justify-between items-center pb-4 ".concat(isMobile ? "bunny-shadow-padding-x" : ""), id: "acceptance" }, { children: [jsx("div", { children: onBackButtonClick ? (jsx(Button, __assign({ className: "pl-0", onClick: onBackButtonClick, style: {
356
356
  color: secondaryColor,
357
357
  }, type: "link" }, { children: backButtonName || "Back" }))) : null }), !hideDownloadButton ? (jsx(Button, __assign({ icon: jsx(DownloadOutlined, {}), onClick: function () {
358
358
  return downloadFile(apiHost + "/api/pdf/invoice/" + formattedInvoice.id, token);
@@ -1547,9 +1547,7 @@ function ActualInvoice() {
1547
1547
  }, [formattedInvoice]);
1548
1548
  if (!formattedInvoice)
1549
1549
  return jsx(Fragment, {});
1550
- return (jsx("div", __assign({ className: "bunny-invoice-container" }, { children: jsxs("div", __assign({ className: "flex gap-6 ".concat(isMobile
1551
- ? "flex-col w-full overflow-hidden"
1552
- : "bunny-shadow-padding-xb", " ").concat(className) }, { children: [formattedInvoice.isLegacy ? (jsx("div", __assign({ className: "flex justify-center w-full" }, { children: jsx(InvoicePDF, { invoiceUuid: formattedInvoice.uuid, apiHost: apiHost, token: token }) }))) : (invoiceQuoteViewComponent || (jsx(InvoiceQuoteView, { html: formattedInvoice.html, formattedInvoice: formattedInvoice, backButtonName: backButtonName, onBackButtonClick: onBackButtonClick }))), isInvoicePayable && (jsx("div", __assign({ className: "w-full ".concat(hideDownloadButton || formattedInvoice.isLegacy ? "" : "pt-12") }, { children: jsx(PaymentForm, { onPaymentSuccess: onSuccess, onFail: onFail, invoice: formattedInvoice, graphQLClient: graphQLClient }) })))] })) })));
1550
+ return (jsx("div", __assign({ className: "bunny-invoice-container" }, { children: jsxs("div", __assign({ className: "flex gap-6 ".concat(isMobile ? "flex-col w-full overflow-hidden" : "", " ").concat(className) }, { children: [formattedInvoice.isLegacy ? (jsx("div", __assign({ className: "flex justify-center w-full" }, { children: jsx(InvoicePDF, { invoiceUuid: formattedInvoice.uuid, apiHost: apiHost, token: token }) }))) : (invoiceQuoteViewComponent || (jsx(InvoiceQuoteView, { html: formattedInvoice.html, formattedInvoice: formattedInvoice, backButtonName: backButtonName, onBackButtonClick: onBackButtonClick }))), isInvoicePayable && (jsx("div", __assign({ className: "w-full ".concat(hideDownloadButton || formattedInvoice.isLegacy ? "" : "pt-12") }, { children: jsx(PaymentForm, { onPaymentSuccess: onSuccess, onFail: onFail, invoice: formattedInvoice, graphQLClient: graphQLClient }) })))] })) })));
1553
1551
  }
1554
1552
 
1555
1553
  var MUTATION$7 = function (id) { return "\n query formattedQuote ($id: ID) {\n formattedQuote (id: $id) {\n payableId\n acceptedAt\n acceptedByName\n amount\n amountDue\n amountsByPeriod {\n id\n name\n amount\n }\n object { documents { id filename size date url } }\n billingCity\n billingCountry\n billingState\n billingStreet\n billingZip\n contactName\n currency\n customerBillingCity\n customerBillingCountry\n customerBillingState\n customerBillingStreet\n customerBillingZip\n customerName\n discount\n discountValue\n duration\n endDate\n expiresAt\n html\n formattedLines {\n amount\n amountsByPeriod {\n quantity\n id\n name\n startDate\n endDate\n amount\n amountsByTier {\n id\n tier {\n starts\n ends\n price\n }\n quantity\n amount\n }\n prorationRate\n }\n billingPeriodEnd\n billingPeriodStart\n chargeType\n discount\n frequency\n isRamp\n periods\n planName\n position\n price\n priceDecimals\n priceListChargeId\n priceListChargeName\n priceListId\n priceListName\n priceTiers {\n price\n starts\n }\n pricingModel\n productName\n prorationRate\n quantity\n showProductNameOnLineItem\n taxCode\n trialEndDate\n trialStartDate\n unitOfMeasure\n vatCode\n }\n netPaymentDays\n notes\n number\n poNumberRequired\n salesContactEmail\n sharedAt\n startDate\n state\n subtotal\n taxAmount\n taxNumberLabel\n taxNumberRequired\n vendorName\n }\n }"; };
@@ -20226,6 +20224,35 @@ var PaymentFormWrapper = function (_a) {
20226
20224
  })) }, { children: children })));
20227
20225
  };
20228
20226
 
20227
+ var useCurrentUserData = function () {
20228
+ var queryClient = useQueryClient();
20229
+ var token = useToken();
20230
+ var currentUser = queryClient.getQueryData(QueryKeyFactory.default.currentUserKey(token));
20231
+ if (!currentUser)
20232
+ return {};
20233
+ return currentUser;
20234
+ };
20235
+
20236
+ var BunnyFooterIcon = function (_a) {
20237
+ var color = _a.color;
20238
+ return (jsxs("svg", __assign({ width: "45", height: "15", viewBox: "0 0 39 13", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsxs("g", __assign({ clipPath: "url(#clip0_6_851)" }, { children: [jsx("path", { className: "bunny-icon-path", d: "M14.5898 7.19708C14.5898 9.35053 13.0926 10.325 11.2495 10.325C9.39955 10.325 7.90234 9.35001 7.90234 7.18967V3.26221H10.1125V7.00052C10.1125 7.87719 10.5855 8.27725 11.2495 8.27725C11.9061 8.27725 12.3865 7.87719 12.3865 7.00052V3.26221H14.5898V7.19708Z", fill: color }), jsx("path", { className: "bunny-icon-path", d: "M31.8943 12.9625H29.4793L31.8523 8.62816L28.9355 3.26221H31.4708L33.0457 6.35524L34.5924 3.26221H37.0075L31.8943 12.9625Z", fill: color }), jsx("path", { className: "bunny-icon-path", d: "M15.1602 5.96827C15.1602 3.8148 16.6574 2.84033 18.5005 2.84033C20.3504 2.84033 21.8476 3.81533 21.8476 5.97568V10.1473H19.6374V6.16483C19.6374 5.28815 19.1645 4.8881 18.5005 4.8881C17.8439 4.8881 17.3634 5.28815 17.3634 6.16483V10.1473H15.1602V5.96827Z", fill: color }), jsx("path", { className: "bunny-icon-path", d: "M22.4316 5.96827C22.4316 3.8148 23.9289 2.84033 25.7719 2.84033C27.6219 2.84033 29.1191 3.81533 29.1191 5.97568V10.1473H26.9089V6.16483C26.9089 5.28815 26.4359 4.8881 25.7719 4.8881C25.1154 4.8881 24.6349 5.28815 24.6349 6.16483V10.1473H22.4316V5.96827Z", fill: color }), jsx("path", { className: "bunny-icon-path", d: "M7.40511 6.68957C7.40511 8.7236 6.02815 10.3227 4.17816 10.3227C3.23907 10.3227 2.61071 9.94378 2.19358 9.40371V10.1404H0.0605469V0.0405273H2.26381V3.91939C2.68041 3.42158 3.28802 3.07069 4.17763 3.07069C6.02759 3.07069 7.40511 4.66981 7.40511 6.68957ZM2.17229 6.69642C2.17229 7.60802 2.77937 8.2744 3.64823 8.2744C4.53783 8.2744 5.13107 7.59372 5.13107 6.69642C5.13107 5.79912 4.53783 5.11844 3.64823 5.11844C2.77937 5.11844 2.17229 5.78482 2.17229 6.69642Z", fill: color }), jsx("path", { className: "bunny-icon-path", d: "M38.966 8.94801C38.966 9.76181 38.2668 10.4631 37.4618 10.4631C36.6499 10.4631 35.9434 9.76181 35.9434 8.94801C35.9434 8.14846 36.6494 7.46094 37.4618 7.46094C38.2668 7.46094 38.966 8.14846 38.966 8.94801Z", fill: color })] })), jsx("defs", { children: jsx("clipPath", __assign({ id: "clip0_6_851" }, { children: jsx("rect", { width: "39", height: "13", fill: "white" }) })) })] })));
20239
+ };
20240
+
20241
+ var Footer = function (_a) {
20242
+ var className = _a.className;
20243
+ var _b = useCurrentUserData(), privacyUrl = _b.privacyUrl, termsUrl = _b.termsUrl;
20244
+ var isMobile = useIsMobile();
20245
+ return (jsxs("div", __assign({ className: "flex items-center justify-between shrink-0 ".concat(isMobile ? "flex-col gap-2 grow" : "", " ").concat(className) }, { children: [(termsUrl || privacyUrl) && (jsxs("div", __assign({ className: "flex items-center gap-3" }, { children: [termsUrl && (jsx(StyedLink, __assign({ className: "text-xs text-slate-400", href: termsUrl, rel: "noopener noreferrer", target: "_blank", type: "text" }, { children: "Terms" }))), privacyUrl && (jsx(StyedLink, __assign({ className: "text-xs text-slate-400", href: privacyUrl, rel: "noopener noreferrer", target: "_blank", type: "text" }, { children: "Privacy" })))] }))), jsx(BunnyMarketingLink, {})] })));
20246
+ };
20247
+ var BunnyMarketingLink = function () {
20248
+ var _a = useState(false), isHovered = _a[0], setIsHovered = _a[1];
20249
+ var isMobile = useIsMobile();
20250
+ return (jsx("div", __assign({ className: "flex items-end justify-end ".concat(isMobile ? "" : "grow") }, { children: jsx(StyledBunnyLink, __assign({ className: "flex items-end justify-end text-slate-400", href: "https://bunny.com/", rel: "noopener noreferrer", target: "_blank" }, { children: jsxs("div", __assign({ className: "flex items-center", onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); } }, { children: ["Powered by\u00A0", jsx("div", __assign({ style: { paddingTop: "5px" } }, { children: jsx(BunnyFooterIcon, { color: isHovered ? PRIMARY_COLOR : SLATE_400 }) }))] })) })) })));
20251
+ };
20252
+ var StyedLink = styled.a(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n font-family: Inter;\n text-decoration: none;\n font-size: 14px;\n"], ["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n font-family: Inter;\n text-decoration: none;\n font-size: 14px;\n"])), SLATE_400, SLATE_500);
20253
+ var StyledBunnyLink = styled(StyedLink)(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n &:hover {\n color: ", " !important;\n }\n"], ["\n &:hover {\n color: ", " !important;\n }\n"])), PRIMARY_COLOR);
20254
+ var templateObject_1$5, templateObject_2$1;
20255
+
20229
20256
  var queryKeyFactory = QueryKeyFactory.default;
20230
20257
  var Checkout = function (_a) {
20231
20258
  var _b, _c;
@@ -20305,45 +20332,9 @@ var Checkout = function (_a) {
20305
20332
  onFail(error);
20306
20333
  }, onSuccess: onSuccess, quote: quote, taxationRequiredAccountFields: taxationRequiredAccountFields, token: token })) : (jsx(PaymentForm, { onFail: function (error) {
20307
20334
  onFail(error);
20308
- }, onPaymentSuccess: onSuccess, graphQLClient: graphQLClient }))] }))] })) })));
20335
+ }, onPaymentSuccess: onSuccess, graphQLClient: graphQLClient }))] })), jsx(Footer, {})] })) })));
20309
20336
  };
20310
20337
 
20311
- var useCurrentUserData = function () {
20312
- var queryClient = useQueryClient();
20313
- var token = useToken();
20314
- var currentUser = queryClient.getQueryData(QueryKeyFactory.default.currentUserKey(token));
20315
- if (!currentUser)
20316
- return {};
20317
- return currentUser;
20318
- };
20319
-
20320
- var BunnyFooterIcon = function (_a) {
20321
- var color = _a.color;
20322
- return (jsxs("svg", __assign({ width: "45", height: "15", viewBox: "0 0 39 13", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsxs("g", __assign({ clipPath: "url(#clip0_6_851)" }, { children: [jsx("path", { className: "bunny-icon-path", d: "M14.5898 7.19708C14.5898 9.35053 13.0926 10.325 11.2495 10.325C9.39955 10.325 7.90234 9.35001 7.90234 7.18967V3.26221H10.1125V7.00052C10.1125 7.87719 10.5855 8.27725 11.2495 8.27725C11.9061 8.27725 12.3865 7.87719 12.3865 7.00052V3.26221H14.5898V7.19708Z", fill: color }), jsx("path", { className: "bunny-icon-path", d: "M31.8943 12.9625H29.4793L31.8523 8.62816L28.9355 3.26221H31.4708L33.0457 6.35524L34.5924 3.26221H37.0075L31.8943 12.9625Z", fill: color }), jsx("path", { className: "bunny-icon-path", d: "M15.1602 5.96827C15.1602 3.8148 16.6574 2.84033 18.5005 2.84033C20.3504 2.84033 21.8476 3.81533 21.8476 5.97568V10.1473H19.6374V6.16483C19.6374 5.28815 19.1645 4.8881 18.5005 4.8881C17.8439 4.8881 17.3634 5.28815 17.3634 6.16483V10.1473H15.1602V5.96827Z", fill: color }), jsx("path", { className: "bunny-icon-path", d: "M22.4316 5.96827C22.4316 3.8148 23.9289 2.84033 25.7719 2.84033C27.6219 2.84033 29.1191 3.81533 29.1191 5.97568V10.1473H26.9089V6.16483C26.9089 5.28815 26.4359 4.8881 25.7719 4.8881C25.1154 4.8881 24.6349 5.28815 24.6349 6.16483V10.1473H22.4316V5.96827Z", fill: color }), jsx("path", { className: "bunny-icon-path", d: "M7.40511 6.68957C7.40511 8.7236 6.02815 10.3227 4.17816 10.3227C3.23907 10.3227 2.61071 9.94378 2.19358 9.40371V10.1404H0.0605469V0.0405273H2.26381V3.91939C2.68041 3.42158 3.28802 3.07069 4.17763 3.07069C6.02759 3.07069 7.40511 4.66981 7.40511 6.68957ZM2.17229 6.69642C2.17229 7.60802 2.77937 8.2744 3.64823 8.2744C4.53783 8.2744 5.13107 7.59372 5.13107 6.69642C5.13107 5.79912 4.53783 5.11844 3.64823 5.11844C2.77937 5.11844 2.17229 5.78482 2.17229 6.69642Z", fill: color }), jsx("path", { className: "bunny-icon-path", d: "M38.966 8.94801C38.966 9.76181 38.2668 10.4631 37.4618 10.4631C36.6499 10.4631 35.9434 9.76181 35.9434 8.94801C35.9434 8.14846 36.6494 7.46094 37.4618 7.46094C38.2668 7.46094 38.966 8.14846 38.966 8.94801Z", fill: color })] })), jsx("defs", { children: jsx("clipPath", __assign({ id: "clip0_6_851" }, { children: jsx("rect", { width: "39", height: "13", fill: "white" }) })) })] })));
20323
- };
20324
-
20325
- var SubscriptionsContext = createContext({});
20326
-
20327
- var Footer = function (_a) {
20328
- var className = _a.className;
20329
- // Context
20330
- var quotePreviewData = useContext(SubscriptionsContext).quotePreviewData;
20331
- var _b = useCurrentUserData(), privacyUrl = _b.privacyUrl, termsUrl = _b.termsUrl;
20332
- var isMobile = useIsMobile();
20333
- var selectedPriceList = quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.priceList;
20334
- if (selectedPriceList && isMobile)
20335
- return null;
20336
- return (jsxs("div", __assign({ className: "flex items-center justify-between shrink-0 ".concat(isMobile ? "flex-col gap-2 grow" : "", " ").concat(className) }, { children: [(termsUrl || privacyUrl) && (jsxs("div", __assign({ className: "flex items-center gap-3" }, { children: [termsUrl && (jsx(StyedLink, __assign({ className: "text-xs text-slate-400", href: termsUrl, rel: "noopener noreferrer", target: "_blank", type: "text" }, { children: "Terms" }))), privacyUrl && (jsx(StyedLink, __assign({ className: "text-xs text-slate-400", href: privacyUrl, rel: "noopener noreferrer", target: "_blank", type: "text" }, { children: "Privacy" })))] }))), jsx(BunnyMarketingLink, {})] })));
20337
- };
20338
- var BunnyMarketingLink = function () {
20339
- var _a = useState(false), isHovered = _a[0], setIsHovered = _a[1];
20340
- var isMobile = useIsMobile();
20341
- return (jsx("div", __assign({ className: "flex items-end justify-end ".concat(isMobile ? "" : "grow") }, { children: jsx(StyledBunnyLink, __assign({ className: "flex items-end justify-end text-slate-400", href: "https://bunny.com/", rel: "noopener noreferrer", target: "_blank" }, { children: jsxs("div", __assign({ className: "flex items-center", onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); } }, { children: ["Powered by\u00A0", jsx("div", __assign({ style: { paddingTop: "5px" } }, { children: jsx(BunnyFooterIcon, { color: isHovered ? PRIMARY_COLOR : SLATE_400 }) }))] })) })) })));
20342
- };
20343
- var StyedLink = styled.a(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n font-family: Inter;\n text-decoration: none;\n font-size: 14px;\n"], ["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n font-family: Inter;\n text-decoration: none;\n font-size: 14px;\n"])), SLATE_400, SLATE_500);
20344
- var StyledBunnyLink = styled(StyedLink)(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n &:hover {\n color: ", " !important;\n }\n"], ["\n &:hover {\n color: ", " !important;\n }\n"])), PRIMARY_COLOR);
20345
- var templateObject_1$5, templateObject_2$1;
20346
-
20347
20338
  var PageTitle = function (_a) {
20348
20339
  var onGoBack = _a.onGoBack, title = _a.title;
20349
20340
  var isMobile = useIsMobile();
@@ -20358,6 +20349,8 @@ var PageTitle = function (_a) {
20358
20349
  } })), title] })));
20359
20350
  };
20360
20351
 
20352
+ var SubscriptionsContext = createContext({});
20353
+
20361
20354
  var calculateNewQuantity = function (priceList, currentQuantity) {
20362
20355
  if (currentQuantity === void 0) { currentQuantity = 1; }
20363
20356
  var priceListRecurringCharge = priceList === null || priceList === void 0 ? void 0 : priceList.charges.find(function (priceListCharge) {
@@ -20743,7 +20736,7 @@ var getPriceListChangeOptions = function (_a) {
20743
20736
  })];
20744
20737
  case 1:
20745
20738
  response = _b.sent();
20746
- priceListChangeOptions = response;
20739
+ priceListChangeOptions = response.priceListChangeOptions;
20747
20740
  if (priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.errors)
20748
20741
  throw priceListChangeOptions.errors;
20749
20742
  // Sort planChangeOptions.plans by position
@@ -21106,17 +21099,17 @@ var PriceListGridDesktop = function (_a) {
21106
21099
  });
21107
21100
  }, [availablePriceLists, priceListChangeOptions, priceListStart]), availablePlansArray = _b.availablePlansArray, displayPriceLists = _b.displayPriceLists;
21108
21101
  var everythingInPlus = selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.everythingInPlus;
21109
- return (jsx("div", __assign({ className: "shadow-padding-xb" }, { children: jsxs("div", __assign({ className: "relative flex flex-col h-full rounded-md shadow overflow-hidden bg-white" }, { children: [jsx(NextPriceListButton, { availablePriceLists: availablePriceLists, priceListStart: priceListStart, setPriceListStart: setPriceListStart }), jsxs("div", __assign({ className: "grid w-full", style: {
21110
- gridTemplateColumns: everythingInPlus
21111
- ? "repeat(3, minmax(120px, 1fr))"
21112
- : "minmax(auto, 400px) repeat(3, minmax(120px, 1fr))",
21113
- } }, { children: [!everythingInPlus && jsx(PlanPickerGridCell, { noBorder: true }), __spreadArray([], Array(PLANS_TO_DISPLAY), true).map(function (_, index) {
21114
- var priceList = displayPriceLists[index];
21115
- var doesPrevPriceListExist = displayPriceLists[index - 1];
21116
- if (!priceList)
21117
- return jsx(PlanPickerGridCell, { noBorder: !Boolean(doesPrevPriceListExist) }, index);
21118
- return (jsx(PriceListCard, { isSelected: priceList.plan.id === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.plan.id), onClick: onChangePriceList, priceList: priceList, subscriptions: subscriptions, trialRemainingDays: trialRemainingDays }, index));
21119
- }), (selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.everythingInPlus) ? (jsx(EverythingPlanFeatures, { availablePriceLists: availablePriceLists, selectedProduct: selectedProduct })) : (jsx(PlanFeatures, { availablePlansArray: availablePlansArray, selectedProduct: selectedProduct }))] }))] })) })));
21102
+ return (jsxs("div", __assign({ className: "relative flex flex-col rounded-md shadow overflow-hidden bg-white" }, { children: [jsx(NextPriceListButton, { availablePriceLists: availablePriceLists, priceListStart: priceListStart, setPriceListStart: setPriceListStart }), jsxs("div", __assign({ className: "grid w-full", style: {
21103
+ gridTemplateColumns: everythingInPlus
21104
+ ? "repeat(3, minmax(120px, 1fr))"
21105
+ : "minmax(auto, 400px) repeat(3, minmax(120px, 1fr))",
21106
+ } }, { children: [!everythingInPlus && jsx(PlanPickerGridCell, { noBorder: true }), __spreadArray([], Array(PLANS_TO_DISPLAY), true).map(function (_, index) {
21107
+ var priceList = displayPriceLists[index];
21108
+ var doesPrevPriceListExist = displayPriceLists[index - 1];
21109
+ if (!priceList)
21110
+ return (jsx(PlanPickerGridCell, { noBorder: !Boolean(doesPrevPriceListExist) }, index));
21111
+ return (jsx(PriceListCard, { isSelected: priceList.plan.id === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.plan.id), onClick: onChangePriceList, priceList: priceList, subscriptions: subscriptions, trialRemainingDays: trialRemainingDays }, index));
21112
+ }), (selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.everythingInPlus) ? (jsx(EverythingPlanFeatures, { availablePriceLists: availablePriceLists, selectedProduct: selectedProduct })) : (jsx(PlanFeatures, { availablePlansArray: availablePlansArray, selectedProduct: selectedProduct }))] }))] })));
21120
21113
  };
21121
21114
 
21122
21115
  var PriceListGrid = function (_a) {
@@ -21359,16 +21352,25 @@ var PlanManager = function (_a) {
21359
21352
  token: token,
21360
21353
  }),
21361
21354
  queryFn: function () {
21362
- return (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id) ? getQuote({ token: token, id: editingQuoteData.id, apiHost: apiHost }) : undefined;
21355
+ return (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id)
21356
+ ? getQuote({ token: token, id: editingQuoteData.id, apiHost: apiHost })
21357
+ : undefined;
21363
21358
  },
21364
21359
  enabled: Boolean(editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id),
21365
21360
  }).data;
21366
21361
  useEffect(function () {
21367
21362
  if (subscriptionUpgradeId && !upgradingSubscription) {
21368
- var subscription = subscriptions === null || subscriptions === void 0 ? void 0 : subscriptions.find(function (subscription) { return subscription.id === subscriptionUpgradeId; });
21363
+ var subscription = subscriptions === null || subscriptions === void 0 ? void 0 : subscriptions.find(function (subscription) {
21364
+ return subscription.id === subscriptionUpgradeId;
21365
+ });
21369
21366
  setUpgradingSubscription(subscription);
21370
21367
  }
21371
- }, [setUpgradingSubscription, subscriptionUpgradeId, subscriptions, upgradingSubscription]);
21368
+ }, [
21369
+ setUpgradingSubscription,
21370
+ subscriptionUpgradeId,
21371
+ subscriptions,
21372
+ upgradingSubscription,
21373
+ ]);
21372
21374
  useEffect(function () {
21373
21375
  var observer = new IntersectionObserver(function (_a) {
21374
21376
  var entry = _a[0];
@@ -21416,7 +21418,7 @@ var PlanManager = function (_a) {
21416
21418
  return showInfoNotification("You are in preview mode");
21417
21419
  setQuotePreviewData(undefined);
21418
21420
  onChangePlanCancel();
21419
- }, title: "Change plan" }), jsx(PlanPicker, {}), jsx(Checkout, { onCancel: onCancel, onSuccess: onSuccess, onFail: onFail, open: payModalVisible, quote: quote, token: token, isMobile: isMobile, storedPaymentMethod: storedPaymentMethod, selectedPriceList: quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.priceList, quantity: quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.quantity }), jsx("div", { ref: stickyRef }), jsx("div", __assign({ className: "sticky bottom-4 transition-[margin] duration-300 ".concat(isSticky ? "mx-4" : "mx-0") }, { children: jsx(PlanPickerCheckoutBarWrapper, { handlePortalErrors: handlePortalErrors, onCheckoutSuccess: function () { return onChangePlanCancel(); } }) })), jsx(Footer, {})] })));
21421
+ }, title: "Change plan" }), jsx(PlanPicker, {}), jsx(Checkout, { onCancel: onCancel, onSuccess: onSuccess, onFail: onFail, open: payModalVisible, quote: quote, token: token, isMobile: isMobile, storedPaymentMethod: storedPaymentMethod, selectedPriceList: quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.priceList, quantity: quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.quantity }), jsx("div", { ref: stickyRef }), jsx("div", __assign({ className: "sticky bottom-4 transition-[margin] duration-300 ".concat(isSticky ? "mx-4" : "mx-0") }, { children: jsx(PlanPickerCheckoutBarWrapper, { handlePortalErrors: handlePortalErrors, onCheckoutSuccess: function () { return onChangePlanCancel(); } }) }))] })));
21420
21422
  };
21421
21423
 
21422
21424
  var useCancelSubscription = function () {
@@ -22265,7 +22267,9 @@ var Subscriptions = function (_a) {
22265
22267
  token: token,
22266
22268
  }),
22267
22269
  queryFn: function () {
22268
- return (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id) ? getQuote({ token: token, id: editingQuoteData.id, apiHost: apiHost }) : undefined;
22270
+ return (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id)
22271
+ ? getQuote({ token: token, id: editingQuoteData.id, apiHost: apiHost })
22272
+ : undefined;
22269
22273
  },
22270
22274
  enabled: Boolean(editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id),
22271
22275
  }).data;
@@ -22361,7 +22365,7 @@ var Subscriptions = function (_a) {
22361
22365
  setIsChangingPlan(false);
22362
22366
  }, handlePortalErrors: handlePortalErrors }));
22363
22367
  }
22364
- return (jsxs("div", __assign({ className: "".concat(className) }, { children: [!hideTitle ? jsx(PageTitle, { title: "Subscriptions" }) : null, jsx(PageHeaderWithActions, __assign({ title: jsxs(Text$1, __assign({ className: "flex items-center justify-between", style: { minWidth: "137px" } }, { children: [hideExpired ? "Active subscriptions" : "All subscriptions", isMobile && (jsx(HideExpiredToggle, { hideExpired: hideExpired, setHideExpired: setHideExpired, visible: expiredSwitchVisible }))] })) }, { children: !isMobile && (jsx(SubscriptionsNavigation, { expiredSwitchVisible: expiredSwitchVisible, hideExpired: hideExpired, setHideExpired: setHideExpired, setQuantityDrawerOpen: setQuantityDrawerOpen, subscriptions: subscriptions })) })), jsx(SubscriptionsListContainer, { companyName: companyName, hideExpired: hideExpired, onCancelSubscriptionClick: onCancelSubscriptionClick, onChangePlanClick: onChangePlanClick, subscriptions: subscriptions, subscriptionsAreLoading: subscriptionsAreLoading, noSubscriptionsComponent: noSubscriptionsComponent }), isMobile && (jsx("div", __assign({ className: "pt-4 pb-2" }, { children: jsx(SubscriptionsNavigation, { expiredSwitchVisible: expiredSwitchVisible, hideExpired: hideExpired, setHideExpired: setHideExpired, setQuantityDrawerOpen: setQuantityDrawerOpen, subscriptions: subscriptions }) }))), jsx(Footer, {}), jsx(QuantityChangeDrawerDesktop, { editingQuote: quote, editingQuoteData: editingQuoteData, onClose: onClose, open: quantityDrawerOpen, openCheckout: function () { return setPayModalVisible(true); }, setEditingQuoteData: setEditingQuoteData, subscriptions: subscriptions }), jsx(Checkout, { onCancel: onCancel, onSuccess: onSuccess, onFail: onFail, open: payModalVisible, quote: quote, token: token, isMobile: isMobile, storedPaymentMethod: storedPaymentMethod })] })));
22368
+ return (jsxs("div", __assign({ className: "".concat(className) }, { children: [!hideTitle ? jsx(PageTitle, { title: "Subscriptions" }) : null, jsx(PageHeaderWithActions, __assign({ title: jsxs(Text$1, __assign({ className: "flex items-center justify-between", style: { minWidth: "137px" } }, { children: [hideExpired ? "Active subscriptions" : "All subscriptions", isMobile && (jsx(HideExpiredToggle, { hideExpired: hideExpired, setHideExpired: setHideExpired, visible: expiredSwitchVisible }))] })) }, { children: !isMobile && (jsx(SubscriptionsNavigation, { expiredSwitchVisible: expiredSwitchVisible, hideExpired: hideExpired, setHideExpired: setHideExpired, setQuantityDrawerOpen: setQuantityDrawerOpen, subscriptions: subscriptions })) })), jsx(SubscriptionsListContainer, { companyName: companyName, hideExpired: hideExpired, onCancelSubscriptionClick: onCancelSubscriptionClick, onChangePlanClick: onChangePlanClick, subscriptions: subscriptions, subscriptionsAreLoading: subscriptionsAreLoading, noSubscriptionsComponent: noSubscriptionsComponent }), isMobile && (jsx("div", __assign({ className: "pt-4 pb-2" }, { children: jsx(SubscriptionsNavigation, { expiredSwitchVisible: expiredSwitchVisible, hideExpired: hideExpired, setHideExpired: setHideExpired, setQuantityDrawerOpen: setQuantityDrawerOpen, subscriptions: subscriptions }) }))), jsx(QuantityChangeDrawerDesktop, { editingQuote: quote, editingQuoteData: editingQuoteData, onClose: onClose, open: quantityDrawerOpen, openCheckout: function () { return setPayModalVisible(true); }, setEditingQuoteData: setEditingQuoteData, subscriptions: subscriptions }), jsx(Checkout, { onCancel: onCancel, onSuccess: onSuccess, onFail: onFail, open: payModalVisible, quote: quote, token: token, isMobile: isMobile, storedPaymentMethod: storedPaymentMethod })] })));
22365
22369
  };
22366
22370
  var PageHeaderWithActions = function (_a) {
22367
22371
  var children = _a.children, title = _a.title;
@@ -22594,4 +22598,4 @@ var PaymentFormSection = function (_a) {
22594
22598
  }, graphQLClient: graphQLClient }) })));
22595
22599
  };
22596
22600
 
22597
- export { BillingDetails, BunnyProvider, Invoice, PaymentForm, PaymentMethod, Quote, Quotes, Signup, SubscriptionsWrapper as Subscriptions, Transactions };
22601
+ export { BillingDetails, BunnyProvider, Footer, Invoice, PaymentForm, PaymentMethod, Quote, Quotes, Signup, SubscriptionsWrapper as Subscriptions, Transactions };
@@ -1,4 +1,4 @@
1
1
  declare const Footer: ({ className }: {
2
2
  className?: string | undefined;
3
- }) => import("react/jsx-runtime").JSX.Element | null;
3
+ }) => import("react/jsx-runtime").JSX.Element;
4
4
  export default Footer;
@@ -0,0 +1 @@
1
+ export { default as Footer } from "./Footer";
@@ -11,7 +11,7 @@ declare const SubscriptionsWrapper: ({ handlePortalErrors, companyName, isInPrev
11
11
  className?: string | undefined;
12
12
  styles?: {
13
13
  gap?: number | undefined;
14
- shadow?: "none" | "sm" | "md" | "lg" | undefined;
14
+ shadow?: "none" | "lg" | "md" | "sm" | undefined;
15
15
  subscriptionProductNameStyle?: import("react").CSSProperties | undefined;
16
16
  } | undefined;
17
17
  noSubscriptionsComponent?: React.ReactNode;
@@ -7,3 +7,4 @@ export { default as BunnyProvider } from "./BunnyProvider";
7
7
  export { default as Transactions } from "./Transactions";
8
8
  export { Subscriptions } from "./Subscriptions";
9
9
  export { BillingDetails } from "./BillingDetails";
10
+ export { Footer } from "./Footer";
package/dist/index.d.ts CHANGED
@@ -177,7 +177,7 @@ declare const SubscriptionsWrapper: ({ handlePortalErrors, companyName, isInPrev
177
177
  className?: string | undefined;
178
178
  styles?: {
179
179
  gap?: number | undefined;
180
- shadow?: "none" | "sm" | "md" | "lg" | undefined;
180
+ shadow?: "none" | "lg" | "md" | "sm" | undefined;
181
181
  subscriptionProductNameStyle?: react.CSSProperties | undefined;
182
182
  } | undefined;
183
183
  noSubscriptionsComponent?: React.ReactNode;
@@ -196,4 +196,8 @@ declare const BillingDetails: ({ isCardEnabled, shadow, className, hidePaymentMe
196
196
  }) => boolean) | undefined;
197
197
  }) => react_jsx_runtime.JSX.Element;
198
198
 
199
- export { BillingDetails, BunnyProvider, Invoice, PaymentForm, PaymentMethod, Quote, Quotes, Signup, SubscriptionsWrapper as Subscriptions, Transactions };
199
+ declare const Footer: ({ className }: {
200
+ className?: string | undefined;
201
+ }) => react_jsx_runtime.JSX.Element;
202
+
203
+ export { BillingDetails, BunnyProvider, Footer, Invoice, PaymentForm, PaymentMethod, Quote, Quotes, Signup, SubscriptionsWrapper as Subscriptions, Transactions };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bunnyapp/components",
3
- "version": "1.0.53",
3
+ "version": "1.0.54",
4
4
  "description": "Components from the Bunny portal to embed Bunny UI functionality into your application.",
5
5
  "main": "dist/cjs/index.js",
6
6
  "module": "dist/esm/index.js",