@ultraviolet/plus 3.4.5 → 3.5.0

package/dist/components/EstimateCost/EstimateCostContent.js

@@ -1,399 +1,289 @@
-"use client";
-import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { CalculatorIcon } from "@ultraviolet/icons/CalculatorIcon";
-import { Stack, Text, Alert, Badge } from "@ultraviolet/ui";
-import { cn } from "@ultraviolet/utils";
-import { assignInlineVars } from "@vanilla-extract/dynamic";
-import { useState, useMemo, useEffect, memo, Children, cloneElement, isValidElement } from "react";
-import { useInView } from "react-intersection-observer";
-import { CustomUnitInput } from "./Components/CustomUnitInput.js";
-import { Item } from "./Components/Item.js";
-import { LineThrough } from "./Components/LineThrough.js";
-import { maximumFractionDigitsLong, maximumFractionDigits } from "./constants.js";
+'use client';
+import { __name } from "../../_virtual/_rolldown/runtime.js";
+import en_default from "./locales/en.js";
+import { maximumFractionDigits, maximumFractionDigitsLong } from "./constants.js";
 import { useEstimateCost } from "./EstimateCostProvider.js";
 import { calculatePrice } from "./helper.js";
-import EstimateCostLocales from "./locales/en.js";
-import { OverlayComponent } from "./OverlayComponent.js";
 import { OverlayContextProvider } from "./OverlayContext.js";
-import { estimateCostCompact, estimateCostCompactText, estimateCostContent, estimateCostTable, estimateCostPriceColumn, estimateCostTimeCell, estimateCostPriceCellContent, estimateCostPriceCell, estimateCostEmptyTable, estimateCostEmptyCell, estimateCostBadgeBeta, estimateCostText, paddingLeftCell, estimateCostCell, estimateCostTotalPriceCell, estimatecostFeesText, estimateCostFeesTable, estimateCostTitle, estimateCostCalculatorIcon } from "./styles.css.js";
-const DEFAULT_UNIT_LIST = ["hours", "days", "months"];
-const DescriptionComponent = memo(
-  ({
-    description,
-    locales
-  }) => description === void 0 || typeof description === "string" ? /* @__PURE__ */ jsx(Text, { as: "span", variant: "body", children: description || locales["estimate.cost.description"] }) : description
-);
-const TitleComponent = memo(
-  ({
-    locales
-  }) => /* @__PURE__ */ jsxs("h3", { className: estimateCostTitle, children: [
-    /* @__PURE__ */ jsx(
-      CalculatorIcon,
-      {
-        className: estimateCostCalculatorIcon,
-        sentiment: "primary",
-        size: "medium"
-      }
-    ),
-    locales?.["estimate.cost.label"]
-  ] })
-);
-const EstimateCostContent = ({
-  description,
-  alert,
-  alertTitle,
-  alertVariant = "warning",
-  defaultTimeUnit = "hours",
-  timeUnits = DEFAULT_UNIT_LIST,
-  hideOverlay = false,
-  disableOverlayLeft = false,
-  disableOverlayRight = false,
-  hideTimeUnit = false,
-  hideTotal = false,
-  hideHourlyPriceOnTotal = false,
-  discount = 0,
-  OverlayRight,
-  OverlayLeft,
-  isBeta = false,
-  commitmentFees,
-  commitmentFeesContent,
-  monthlyFees,
-  monthlyFeesLabel,
-  monthlyFeesContent,
-  overlayUnit = "hours",
-  children = null,
-  locales = EstimateCostLocales,
-  overlayMargin,
-  onTotalPriceChange,
-  style,
-  compact
-}) => {
-  const { formatNumber } = useEstimateCost();
-  const [ref, inView] = useInView();
-  const [products, setProducts] = useState([]);
-  const [totalPrice, setTotalPrice] = useState({
-    hourly: 0,
-    maxHourly: 0,
-    maxOverlayHourly: 0,
-    maxTotal: 0,
-    overlayHourly: 0,
-    total: 0
-  });
-  const [iteration, setIteration] = useState({
-    unit: defaultTimeUnit ?? "hours",
-    value: 1
-  });
-  const [isLongFractionDigits, setIsLongFractionDigits] = useState(false);
-  const providerValue = useMemo(() => ({ isOverlay: false }), []);
-  const totalValue = useMemo(
-    () => formatNumber(totalPrice.total < 0 ? 0 : totalPrice.total, {
-      maximumFractionDigits: isLongFractionDigits ? maximumFractionDigitsLong[iteration.unit] : maximumFractionDigits[iteration.unit]
-    }),
-    [formatNumber, isLongFractionDigits, iteration.unit, totalPrice.total]
-  );
-  const totalMaxValue = useMemo(
-    () => formatNumber(totalPrice.maxTotal < 0 ? 0 : totalPrice.maxTotal, {
-      maximumFractionDigits: isLongFractionDigits ? maximumFractionDigitsLong[iteration.unit] : maximumFractionDigits[iteration.unit]
-    }),
-    [formatNumber, isLongFractionDigits, iteration.unit, totalPrice.maxTotal]
-  );
-  const productsCallback = useMemo(
-    () => ({
-      add: (newProduct) => {
-        setProducts((total) => {
-          if (total.find((product) => product.id === newProduct.id)) {
-            return total.map(
-              (product) => product.id === newProduct.id ? newProduct : product
-            );
-          }
-          return [...total, newProduct];
-        });
-      },
-      remove: ({ id }) => {
-        setProducts((total) => total.filter((product) => product.id !== id));
-      }
-    }),
-    [setProducts]
-  );
-  useEffect(() => {
-    const isMaxAmountInProducts = products.find((product) => product.maxAmount);
-    setIsLongFractionDigits(
-      !!products.find((product) => product.longFractionDigits)
-    );
-    setTotalPrice({
-      hourly: products.reduce(
-        (acc, product) => acc + (product.noIteration ? 0 : (product.price - product.price * product.discount) * Math.max(product.amount - product.amountFree, 0)),
-        0
-      ),
-      maxHourly: isMaxAmountInProducts ? products.reduce(
-        (acc, product) => acc && product.noIteration ? 0 : (product.price - product.price * product.discount) * Math.max(product.maxAmount - product.amountFree, 0),
-        0
-      ) : 0,
-      maxOverlayHourly: isMaxAmountInProducts ? products.reduce(
-        (acc, product) => acc + (product.noIteration ? 0 : (product.price - product.price * product.discount) * Math.max(product.maxAmount - product.amountFree, 0)),
-        0
-      ) : 0,
-      maxTotal: isMaxAmountInProducts ? products.reduce(
-        (acc, product) => acc + calculatePrice({
-          amount: product.maxAmount || product.amount,
-          // Not all products have maxAmount, so we need to check both
-          amountFree: product.amountFree,
-          discount: product.discount,
-          price: product.price,
-          timeAmount: product.noIteration ? 1 : iteration.value,
-          timeUnit: product.noIteration ? "hours" : iteration.unit
-        }),
-        0
-      ) : 0,
-      overlayHourly: products.reduce(
-        (acc, product) => acc + (product.noIteration ? 0 : (product.price - product.price * product.discount) * Math.max(product.amount - product.amountFree, 0)),
-        0
-      ),
-      total: hideTotal ? 0 : products.reduce(
-        (acc, product) => acc + calculatePrice({
-          amount: product.amount,
-          amountFree: product.amountFree,
-          discount: product.discount,
-          price: product.price,
-          timeAmount: product.noIteration ? 1 : iteration.value,
-          timeUnit: product.noIteration ? "hours" : iteration.unit
-        }),
-        0
-      )
-    });
-    onTotalPriceChange?.({
-      total: totalPrice.total,
-      totalMax: totalPrice.maxTotal > 0 ? totalPrice.maxTotal : void 0
-    });
-  }, [
-    hideTotal,
-    products,
-    iteration,
-    setTotalPrice,
-    onTotalPriceChange,
-    totalPrice.total,
-    totalPrice.maxTotal,
-    totalValue,
-    totalMaxValue
-  ]);
-  useEffect(() => {
-    if (hideTimeUnit && (iteration.value > 1 || iteration.unit !== (defaultTimeUnit ?? "hours"))) {
-      setIteration({ unit: defaultTimeUnit ?? "hours", value: 1 });
-    }
-  }, [hideTimeUnit, iteration, defaultTimeUnit]);
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    compact ? /* @__PURE__ */ jsxs(
-      Stack,
-      {
-        alignItems: "center",
-        className: estimateCostCompact,
-        direction: "row",
-        justifyContent: "space-between",
-        children: [
-          /* @__PURE__ */ jsxs(Text, { as: "p", className: estimateCostCompactText, variant: "bodyStrong", children: [
-            /* @__PURE__ */ jsx(CalculatorIcon, { sentiment: "primary", size: "medium" }),
-            locales["estimate.cost.label"]
-          ] }),
-          /* @__PURE__ */ jsxs(Stack, { alignItems: "center", direction: "row", children: [
-            /* @__PURE__ */ jsxs(Text, { as: "span", variant: "headingSmallStrong", children: [
-              "€",
-              totalPrice.total
-            ] }),
-            /* @__PURE__ */ jsxs(Text, { as: "span", variant: "bodyStrong", children: [
-              "/",
-              iteration.unit.length > 1 && iteration.unit.endsWith("s") ? iteration.unit.slice(0, -1) : iteration.unit
-            ] })
-          ] })
-        ]
-      }
-    ) : null,
-    /* @__PURE__ */ jsxs(
-      Stack,
-      {
-        className: estimateCostContent[compact ? "compact" : "default"],
-        gap: 2,
-        style,
-        children: [
-          hideOverlay ? null : /* @__PURE__ */ jsx(
-            OverlayComponent,
-            {
-              disableOverlayLeft,
-              disableOverlayRight,
-              discount,
-              inView,
-              isBeta,
-              OverlayLeft,
-              OverlayRight,
-              overlayMargin,
-              totalPrice,
-              unit: overlayUnit ?? "hours",
-              children
-            }
-          ),
-          description === false ? null : /* @__PURE__ */ jsx(DescriptionComponent, { description, locales }),
-          alert ? /* @__PURE__ */ jsx(Alert, { sentiment: alertVariant, title: alertTitle, children: alert }) : null,
-          /* @__PURE__ */ jsx(OverlayContextProvider, { value: providerValue, children: /* @__PURE__ */ jsxs("div", { children: [
-            children ? /* @__PURE__ */ jsxs(
-              "table",
-              {
-                cellPadding: "0",
-                cellSpacing: "0",
-                className: estimateCostTable[hideTotal ? "noTotal" : "total"],
-                "data-testid": "summary",
-                ref,
-                children: [
-                  /* @__PURE__ */ jsxs("colgroup", { children: [
-                    /* @__PURE__ */ jsx("col", {}),
-                    /* @__PURE__ */ jsx("col", { className: estimateCostPriceColumn })
-                  ] }),
-                  hideTimeUnit ? null : /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
-                    /* @__PURE__ */ jsx("th", { children: /* @__PURE__ */ jsx(TitleComponent, { locales }) }),
-                    /* @__PURE__ */ jsx(
-                      "th",
-                      {
-                        className: cn(
-                          estimateCostPriceCellContent,
-                          estimateCostPriceCell
-                        ),
-                        children: /* @__PURE__ */ jsx("div", { className: estimateCostTimeCell, children: /* @__PURE__ */ jsx(
-                          CustomUnitInput,
-                          {
-                            defaultTimeUnit,
-                            iteration,
-                            setIteration,
-                            timeUnits
-                          }
-                        ) })
-                      }
-                    )
-                  ] }) }),
-                  /* @__PURE__ */ jsx("tbody", { children: Children.map(
-                    children,
-                    (child, index) => isValidElement(child) ? cloneElement(child, {
-                      discount: discount && !child.props.discount ? discount : child.props.discount,
-                      isLastElement: index === Children.count(children) - 1,
-                      iteration,
-                      productsCallback
-                    }) : child
-                  ) })
-                ]
-              }
-            ) : null,
-            hideTotal ? null : /* @__PURE__ */ jsxs(
-              "table",
-              {
-                cellPadding: "0",
-                cellSpacing: "0",
-                className: estimateCostEmptyTable,
-                children: [
-                  /* @__PURE__ */ jsxs("colgroup", { children: [
-                    /* @__PURE__ */ jsx("col", {}),
-                    /* @__PURE__ */ jsx("col", { className: estimateCostPriceColumn })
-                  ] }),
-                  /* @__PURE__ */ jsx("tbody", { children: /* @__PURE__ */ jsxs("tr", { children: [
-                    /* @__PURE__ */ jsx(
-                      "td",
-                      {
-                        "aria-label": "control",
-                        className: estimateCostEmptyCell
-                      }
-                    ),
-                    /* @__PURE__ */ jsxs(
-                      "td",
-                      {
-                        className: cn(
-                          estimateCostCell({ hasBorder: false, primary: false }),
-                          estimateCostTotalPriceCell
-                        ),
-                        style: assignInlineVars({
-                          [paddingLeftCell]: "16px"
-                        }),
-                        children: [
-                          isBeta ? /* @__PURE__ */ jsx(
-                            Badge,
-                            {
-                              className: estimateCostBadgeBeta[locales[`estimate.cost.beta.${discount > 0 ? "discount" : "free"}`].length > 25 ? "long" : "short"],
-                              prominence: "strong",
-                              sentiment: "warning",
-                              children: `${discount > 0 ? discount * 100 : ""}
+import { estimateCostBadgeBeta, estimateCostCalculatorIcon, estimateCostCell, estimateCostCompact, estimateCostCompactText, estimateCostContent, estimateCostEmptyCell, estimateCostEmptyTable, estimateCostFeesTable, estimateCostPriceCell, estimateCostPriceCellContent, estimateCostPriceColumn, estimateCostTable, estimateCostText, estimateCostTimeCell, estimateCostTitle, estimateCostTotalPriceCell, estimatecostFeesText, paddingLeftCell } from "./styles.css.js";
+import { Item } from "./Components/Item.js";
+import { LineThrough } from "./Components/LineThrough.js";
+import { CustomUnitInput } from "./Components/CustomUnitInput.js";
+import { OverlayComponent } from "./OverlayComponent.js";
+import { Alert, Badge, Stack, Text } from "@ultraviolet/ui";
+import { cn } from "@ultraviolet/utils";
+import { assignInlineVars } from "@vanilla-extract/dynamic";
+import { Children, cloneElement, isValidElement, memo, useEffect, useMemo, useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { CalculatorIcon } from "@ultraviolet/icons/CalculatorIcon";
+import { useInView } from "react-intersection-observer";
+
+//#region src/components/EstimateCost/EstimateCostContent.tsx
+const DEFAULT_UNIT_LIST = [
+	"hours",
+	"days",
+	"months"
+];
+const DescriptionComponent = memo(({ description, locales }) => description === void 0 || typeof description === "string" ? /* @__PURE__ */ jsx(Text, {
+	as: "span",
+	variant: "body",
+	children: description || locales["estimate.cost.description"]
+}) : description);
+const TitleComponent = memo(({ locales }) => /* @__PURE__ */ jsxs("h3", {
+	className: estimateCostTitle,
+	children: [/* @__PURE__ */ jsx(CalculatorIcon, {
+		className: estimateCostCalculatorIcon,
+		sentiment: "primary",
+		size: "medium"
+	}), locales === null || locales === void 0 ? void 0 : locales["estimate.cost.label"]]
+}));
+const EstimateCostContent = ({ description, alert, alertTitle, alertVariant = "warning", defaultTimeUnit = "hours", timeUnits = DEFAULT_UNIT_LIST, hideOverlay = false, disableOverlayLeft = false, disableOverlayRight = false, hideTimeUnit = false, hideTotal = false, hideHourlyPriceOnTotal = false, discount = 0, OverlayRight, OverlayLeft, isBeta = false, commitmentFees, commitmentFeesContent, monthlyFees, monthlyFeesLabel, monthlyFeesContent, overlayUnit = "hours", children = null, locales = en_default, overlayMargin, onTotalPriceChange, style, compact }) => {
+	const { formatNumber } = useEstimateCost();
+	const [ref, inView] = useInView();
+	const [products, setProducts] = useState([]);
+	const [totalPrice, setTotalPrice] = useState({
+		hourly: 0,
+		maxHourly: 0,
+		maxOverlayHourly: 0,
+		maxTotal: 0,
+		overlayHourly: 0,
+		total: 0
+	});
+	const [iteration, setIteration] = useState({
+		unit: defaultTimeUnit !== null && defaultTimeUnit !== void 0 ? defaultTimeUnit : "hours",
+		value: 1
+	});
+	const [isLongFractionDigits, setIsLongFractionDigits] = useState(false);
+	const providerValue = useMemo(() => ({ isOverlay: false }), []);
+	const totalValue = useMemo(() => formatNumber(totalPrice.total < 0 ? 0 : totalPrice.total, { maximumFractionDigits: isLongFractionDigits ? maximumFractionDigitsLong[iteration.unit] : maximumFractionDigits[iteration.unit] }), [
+		formatNumber,
+		isLongFractionDigits,
+		iteration.unit,
+		totalPrice.total
+	]);
+	const totalMaxValue = useMemo(() => formatNumber(totalPrice.maxTotal < 0 ? 0 : totalPrice.maxTotal, { maximumFractionDigits: isLongFractionDigits ? maximumFractionDigitsLong[iteration.unit] : maximumFractionDigits[iteration.unit] }), [
+		formatNumber,
+		isLongFractionDigits,
+		iteration.unit,
+		totalPrice.maxTotal
+	]);
+	const productsCallback = useMemo(() => ({
+		add: (newProduct) => {
+			setProducts((total) => {
+				if (total.find((product) => product.id === newProduct.id)) return total.map((product) => product.id === newProduct.id ? newProduct : product);
+				return [...total, newProduct];
+			});
+		},
+		remove: ({ id }) => {
+			setProducts((total) => total.filter((product) => product.id !== id));
+		}
+	}), [setProducts]);
+	useEffect(() => {
+		const isMaxAmountInProducts = products.find((product) => product.maxAmount);
+		setIsLongFractionDigits(!!products.find((product) => product.longFractionDigits));
+		setTotalPrice({
+			hourly: products.reduce((acc, product) => acc + (product.noIteration ? 0 : (product.price - product.price * product.discount) * Math.max(product.amount - product.amountFree, 0)), 0),
+			maxHourly: isMaxAmountInProducts ? products.reduce((acc, product) => acc && product.noIteration ? 0 : (product.price - product.price * product.discount) * Math.max(product.maxAmount - product.amountFree, 0), 0) : 0,
+			maxOverlayHourly: isMaxAmountInProducts ? products.reduce((acc, product) => acc + (product.noIteration ? 0 : (product.price - product.price * product.discount) * Math.max(product.maxAmount - product.amountFree, 0)), 0) : 0,
+			maxTotal: isMaxAmountInProducts ? products.reduce((acc, product) => acc + calculatePrice({
+				amount: product.maxAmount || product.amount,
+				amountFree: product.amountFree,
+				discount: product.discount,
+				price: product.price,
+				timeAmount: product.noIteration ? 1 : iteration.value,
+				timeUnit: product.noIteration ? "hours" : iteration.unit
+			}), 0) : 0,
+			overlayHourly: products.reduce((acc, product) => acc + (product.noIteration ? 0 : (product.price - product.price * product.discount) * Math.max(product.amount - product.amountFree, 0)), 0),
+			total: hideTotal ? 0 : products.reduce((acc, product) => acc + calculatePrice({
+				amount: product.amount,
+				amountFree: product.amountFree,
+				discount: product.discount,
+				price: product.price,
+				timeAmount: product.noIteration ? 1 : iteration.value,
+				timeUnit: product.noIteration ? "hours" : iteration.unit
+			}), 0)
+		});
+		onTotalPriceChange === null || onTotalPriceChange === void 0 || onTotalPriceChange({
+			total: totalPrice.total,
+			totalMax: totalPrice.maxTotal > 0 ? totalPrice.maxTotal : void 0
+		});
+	}, [
+		hideTotal,
+		products,
+		iteration,
+		setTotalPrice,
+		onTotalPriceChange,
+		totalPrice.total,
+		totalPrice.maxTotal,
+		totalValue,
+		totalMaxValue
+	]);
+	useEffect(() => {
+		if (hideTimeUnit && (iteration.value > 1 || iteration.unit !== (defaultTimeUnit !== null && defaultTimeUnit !== void 0 ? defaultTimeUnit : "hours"))) setIteration({
+			unit: defaultTimeUnit !== null && defaultTimeUnit !== void 0 ? defaultTimeUnit : "hours",
+			value: 1
+		});
+	}, [
+		hideTimeUnit,
+		iteration,
+		defaultTimeUnit
+	]);
+	return /* @__PURE__ */ jsxs(Fragment, { children: [compact ? /* @__PURE__ */ jsxs(Stack, {
+		alignItems: "center",
+		className: estimateCostCompact,
+		direction: "row",
+		justifyContent: "space-between",
+		children: [/* @__PURE__ */ jsxs(Text, {
+			as: "p",
+			className: estimateCostCompactText,
+			variant: "bodyStrong",
+			children: [/* @__PURE__ */ jsx(CalculatorIcon, {
+				sentiment: "primary",
+				size: "medium"
+			}), locales["estimate.cost.label"]]
+		}), /* @__PURE__ */ jsxs(Stack, {
+			alignItems: "center",
+			direction: "row",
+			children: [/* @__PURE__ */ jsxs(Text, {
+				as: "span",
+				variant: "headingSmallStrong",
+				children: ["€", totalPrice.total]
+			}), /* @__PURE__ */ jsxs(Text, {
+				as: "span",
+				variant: "bodyStrong",
+				children: ["/", iteration.unit.length > 1 && iteration.unit.endsWith("s") ? iteration.unit.slice(0, -1) : iteration.unit]
+			})]
+		})]
+	}) : null, /* @__PURE__ */ jsxs(Stack, {
+		className: estimateCostContent[compact ? "compact" : "default"],
+		gap: 2,
+		style,
+		children: [
+			hideOverlay ? null : /* @__PURE__ */ jsx(OverlayComponent, {
+				disableOverlayLeft,
+				disableOverlayRight,
+				discount,
+				inView,
+				isBeta,
+				OverlayLeft,
+				OverlayRight,
+				overlayMargin,
+				totalPrice,
+				unit: overlayUnit !== null && overlayUnit !== void 0 ? overlayUnit : "hours",
+				children
+			}),
+			description === false ? null : /* @__PURE__ */ jsx(DescriptionComponent, {
+				description,
+				locales
+			}),
+			alert ? /* @__PURE__ */ jsx(Alert, {
+				sentiment: alertVariant,
+				title: alertTitle,
+				children: alert
+			}) : null,
+			/* @__PURE__ */ jsx(OverlayContextProvider, {
+				value: providerValue,
+				children: /* @__PURE__ */ jsxs("div", { children: [
+					children ? /* @__PURE__ */ jsxs("table", {
+						cellPadding: "0",
+						cellSpacing: "0",
+						className: estimateCostTable[hideTotal ? "noTotal" : "total"],
+						"data-testid": "summary",
+						ref,
+						children: [
+							/* @__PURE__ */ jsxs("colgroup", { children: [/* @__PURE__ */ jsx("col", {}), /* @__PURE__ */ jsx("col", { className: estimateCostPriceColumn })] }),
+							hideTimeUnit ? null : /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [/* @__PURE__ */ jsx("th", { children: /* @__PURE__ */ jsx(TitleComponent, { locales }) }), /* @__PURE__ */ jsx("th", {
+								className: cn(estimateCostPriceCellContent, estimateCostPriceCell),
+								children: /* @__PURE__ */ jsx("div", {
+									className: estimateCostTimeCell,
+									children: /* @__PURE__ */ jsx(CustomUnitInput, {
+										defaultTimeUnit,
+										iteration,
+										setIteration,
+										timeUnits
+									})
+								})
+							})] }) }),
+							/* @__PURE__ */ jsx("tbody", { children: Children.map(children, (child, index) => isValidElement(child) ? cloneElement(child, {
+								discount: discount && !child.props.discount ? discount : child.props.discount,
+								isLastElement: index === Children.count(children) - 1,
+								iteration,
+								productsCallback
+							}) : child) })
+						]
+					}) : null,
+					hideTotal ? null : /* @__PURE__ */ jsxs("table", {
+						cellPadding: "0",
+						cellSpacing: "0",
+						className: estimateCostEmptyTable,
+						children: [/* @__PURE__ */ jsxs("colgroup", { children: [/* @__PURE__ */ jsx("col", {}), /* @__PURE__ */ jsx("col", { className: estimateCostPriceColumn })] }), /* @__PURE__ */ jsx("tbody", { children: /* @__PURE__ */ jsxs("tr", { children: [/* @__PURE__ */ jsx("td", {
+							"aria-label": "control",
+							className: estimateCostEmptyCell
+						}), /* @__PURE__ */ jsxs("td", {
+							className: cn(estimateCostCell({
+								hasBorder: false,
+								primary: false
+							}), estimateCostTotalPriceCell),
+							style: assignInlineVars({ [paddingLeftCell]: "16px" }),
+							children: [
+								isBeta ? /* @__PURE__ */ jsx(Badge, {
+									className: estimateCostBadgeBeta[locales[`estimate.cost.beta.${discount > 0 ? "discount" : "free"}`].length > 25 ? "long" : "short"],
+									prominence: "strong",
+									sentiment: "warning",
+									children: `${discount > 0 ? discount * 100 : ""}
                           ${locales[`estimate.cost.beta.${discount > 0 ? "discount" : "free"}`]}`
-                            }
-                          ) : null,
-                          /* @__PURE__ */ jsx(
-                            Text,
-                            {
-                              as: "h3",
-                              className: estimateCostText[isBeta ? "beta" : "notBeta"],
-                              sentiment: "primary",
-                              variant: "heading",
-                              children: /* @__PURE__ */ jsxs(
-                                LineThrough,
-                                {
-                                  isActive: isBeta && (discount === 0 || discount >= 1),
-                                  children: [
-                                    totalValue,
-                                    totalPrice.maxTotal > 0 ? ` - ${totalMaxValue}` : null
-                                  ]
-                                }
-                              )
-                            }
-                          ),
-                          hideHourlyPriceOnTotal && totalPrice.hourly > 0 && totalPrice.hourly !== totalPrice.total && totalPrice.total > 0 ? /* @__PURE__ */ jsx(Text, { as: "p", placement: "right", variant: "body", children: /* @__PURE__ */ jsxs(
-                            LineThrough,
-                            {
-                              isActive: isBeta && (discount === 0 || discount >= 1),
-                              children: [
-                                formatNumber(totalPrice.hourly, {
-                                  maximumFractionDigits: isLongFractionDigits ? maximumFractionDigitsLong.hours : maximumFractionDigits.hours
-                                }),
-                                totalPrice.maxHourly > 0 ? ` - ${formatNumber(totalPrice.maxHourly, {
-                                  maximumFractionDigits: isLongFractionDigits ? maximumFractionDigitsLong.hours : maximumFractionDigits.hours
-                                })}` : null,
-                                "/",
-                                locales["estimate.cost.units.hours.label"].toLowerCase()
-                              ]
-                            }
-                          ) }) : null
-                        ]
-                      }
-                    )
-                  ] }) })
-                ]
-              }
-            ),
-            commitmentFees !== void 0 || monthlyFees !== void 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
-              /* @__PURE__ */ jsx(
-                Text,
-                {
-                  as: "h3",
-                  className: estimatecostFeesText,
-                  variant: "headingSmall",
-                  children: locales[`estimate.cost.fees.${commitmentFees ? "oneTime" : "monthly"}.title`]
-                }
-              ),
-              /* @__PURE__ */ jsx("table", { className: estimateCostFeesTable, children: /* @__PURE__ */ jsx("tbody", { children: /* @__PURE__ */ jsx(
-                Item,
-                {
-                  isLastElement: true,
-                  label: commitmentFees ? locales["estimate.cost.fees.commitment"] : monthlyFeesLabel,
-                  noIteration: true,
-                  price: commitmentFees || monthlyFees,
-                  productsCallback: {
-                    add: () => {
-                    },
-                    remove: () => {
-                    }
-                  },
-                  children: commitmentFees ? commitmentFeesContent : monthlyFeesContent
-                }
-              ) }) })
-            ] }) : null
-          ] }) })
-        ]
-      }
-    )
-  ] });
-};
-export {
-  EstimateCostContent
+								}) : null,
+								/* @__PURE__ */ jsx(Text, {
+									as: "h3",
+									className: estimateCostText[isBeta ? "beta" : "notBeta"],
+									sentiment: "primary",
+									variant: "heading",
+									children: /* @__PURE__ */ jsxs(LineThrough, {
+										isActive: isBeta && (discount === 0 || discount >= 1),
+										children: [totalValue, totalPrice.maxTotal > 0 ? ` - ${totalMaxValue}` : null]
+									})
+								}),
+								hideHourlyPriceOnTotal && totalPrice.hourly > 0 && totalPrice.hourly !== totalPrice.total && totalPrice.total > 0 ? /* @__PURE__ */ jsx(Text, {
+									as: "p",
+									placement: "right",
+									variant: "body",
+									children: /* @__PURE__ */ jsxs(LineThrough, {
+										isActive: isBeta && (discount === 0 || discount >= 1),
+										children: [
+											formatNumber(totalPrice.hourly, { maximumFractionDigits: isLongFractionDigits ? maximumFractionDigitsLong.hours : maximumFractionDigits.hours }),
+											totalPrice.maxHourly > 0 ? ` - ${formatNumber(totalPrice.maxHourly, { maximumFractionDigits: isLongFractionDigits ? maximumFractionDigitsLong.hours : maximumFractionDigits.hours })}` : null,
+											"/",
+											locales["estimate.cost.units.hours.label"].toLowerCase()
+										]
+									})
+								}) : null
+							]
+						})] }) })]
+					}),
+					commitmentFees !== void 0 || monthlyFees !== void 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Text, {
+						as: "h3",
+						className: estimatecostFeesText,
+						variant: "headingSmall",
+						children: locales[`estimate.cost.fees.${commitmentFees ? "oneTime" : "monthly"}.title`]
+					}), /* @__PURE__ */ jsx("table", {
+						className: estimateCostFeesTable,
+						children: /* @__PURE__ */ jsx("tbody", { children: /* @__PURE__ */ jsx(Item, {
+							isLastElement: true,
+							label: commitmentFees ? locales["estimate.cost.fees.commitment"] : monthlyFeesLabel,
+							noIteration: true,
+							price: commitmentFees || monthlyFees,
+							productsCallback: {
+								add: () => {},
+								remove: () => {}
+							},
+							children: commitmentFees ? commitmentFeesContent : monthlyFeesContent
+						}) })
+					})] }) : null
+				] })
+			})
+		]
+	})] });
 };
+
+//#endregion
+export { EstimateCostContent };