@plumile/backoffice-react 0.1.125 → 0.1.130

package/lib/esm/components/backoffice/billing/BackofficeBillingUsageChart.js

@@ -6,55 +6,66 @@ import { TimeSeriesLineChart as s } from "@plumile/ui/components/charts/TimeSeri
 import { formatCurrencyAmount as c } from "@plumile/ui/shared/currencyAmount.js";
 import { toUtcDailyCategorySeries as l } from "@plumile/ui/shared/timeSeries.js";
 //#region src/components/backoffice/billing/BackofficeBillingUsageChart.tsx
-var u = "->", d = ({ ariaLabel: d, buckets: f, categories: p, currency: m, emptyLabel: h, from: g, rangePrefix: _, to: v, totalAmount: y }) => {
-	let b = r(() => p.map((e) => e.id), [p]), x = r(() => Object.fromEntries(p.map((e) => [e.id, e.color])), [p]), S = r(() => Object.fromEntries(p.map((e) => [e.id, e.label])), [p]), C = r(() => g == null || v == null ? [] : l({
-		fromIsoDateTime: g,
-		toIsoDateTime: v,
-		buckets: f,
-		categories: b
+var u = "->", d = (e, t) => new Intl.NumberFormat(void 0, {
+	style: "currency",
+	currency: t,
+	minimumFractionDigits: 0,
+	maximumFractionDigits: 0
+}).format(e), f = ({ ariaLabel: f, buckets: p, categories: m, currency: h, emptyLabel: g, from: _, rangePrefix: v, to: y, totalAmount: b }) => {
+	let x = r(() => m.map((e) => e.id), [m]), S = r(() => Object.fromEntries(m.map((e) => [e.id, e.color])), [m]), C = r(() => Object.fromEntries(m.map((e) => [e.id, e.label])), [m]), w = r(() => _ == null || y == null ? [] : l({
+		fromIsoDateTime: _,
+		toIsoDateTime: y,
+		buckets: p,
+		categories: x
 	}), [
-		f,
-		b,
-		g,
-		v
-	]), w = (e) => c({
+		p,
+		x,
+		_,
+		y
+	]), T = (e) => c({
 		amount: e,
-		currency: m
+		currency: h
 	});
-	return f.length === 0 ? /* @__PURE__ */ i("p", {
+	return p.length === 0 ? /* @__PURE__ */ i("p", {
 		className: e,
-		children: h
+		children: g
 	}) : /* @__PURE__ */ a("div", {
 		className: t,
 		children: [
 			/* @__PURE__ */ i("p", {
 				className: n,
-				children: w(y)
+				children: T(b)
 			}),
-			g != null && v != null && /* @__PURE__ */ a("p", {
+			_ != null && y != null && /* @__PURE__ */ a("p", {
 				className: "txvbqb96 txvbqb19cd txvbqbm9g",
 				children: [
-					_,
+					v,
 					" ",
-					/* @__PURE__ */ i(o, { value: g }),
+					/* @__PURE__ */ i(o, { value: _ }),
 					" ",
 					u,
 					" ",
-					/* @__PURE__ */ i(o, { value: v })
+					/* @__PURE__ */ i(o, { value: y })
 				]
 			}),
 			/* @__PURE__ */ i(s, {
-				ariaLabel: d,
-				categoryColorById: x,
-				categoryLabel: (e) => S[e] ?? e,
-				categoryOrder: b,
-				formatValue: w,
-				series: C
+				ariaLabel: f,
+				categoryColorById: S,
+				categoryLabel: (e) => C[e] ?? e,
+				categoryOrder: x,
+				formatValue: T,
+				series: w,
+				yAxis: {
+					min: 0,
+					minTickStep: 1,
+					maxTickCount: 5,
+					formatValue: (e) => d(e, h)
+				}
 			})
 		]
 	});
 };
 //#endregion
-export { d as BackofficeBillingUsageChart, d as default };
+export { f as BackofficeBillingUsageChart, f as default };
 
 //# sourceMappingURL=BackofficeBillingUsageChart.js.map

package/lib/esm/components/backoffice/billing/BackofficeBillingUsageChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"BackofficeBillingUsageChart.js","names":[],"sources":["../../../../../src/components/backoffice/billing/BackofficeBillingUsageChart.tsx"],"sourcesContent":["import { useMemo, type JSX } from 'react';\nimport { FormattedDate } from '@plumile/ui/atomic/atoms/formatted-date/FormattedDate.js';\nimport { TimeSeriesLineChart } from '@plumile/ui/components/charts/TimeSeriesLineChart.js';\nimport { formatCurrencyAmount } from '@plumile/ui/shared/currencyAmount.js';\nimport { toUtcDailyCategorySeries } from '@plumile/ui/shared/timeSeries.js';\n\nimport * as styles from './backofficeBillingUsageChart.css.js';\n\nexport type BackofficeBillingUsageChartBucket = {\n  readonly day: string;\n  readonly category: string;\n  readonly value: number;\n};\n\nexport type BackofficeBillingUsageChartCategory = {\n  readonly id: string;\n  readonly label: string;\n  readonly color: string;\n};\n\nexport type BackofficeBillingUsageChartProps = {\n  readonly currency: string;\n  readonly totalAmount: number;\n  readonly from: string | null;\n  readonly to: string | null;\n  readonly buckets: readonly BackofficeBillingUsageChartBucket[];\n  readonly categories: readonly BackofficeBillingUsageChartCategory[];\n  readonly emptyLabel: string;\n  readonly rangePrefix: string;\n  readonly ariaLabel: string;\n};\n\nconst dateSeparator = '->';\n\nexport const BackofficeBillingUsageChart = ({\n  ariaLabel,\n  buckets,\n  categories,\n  currency,\n  emptyLabel,\n  from,\n  rangePrefix,\n  to,\n  totalAmount,\n}: BackofficeBillingUsageChartProps): JSX.Element => {\n  const categoryOrder = useMemo(() => {\n    return categories.map((category) => {\n      return category.id;\n    });\n  }, [categories]);\n\n  const categoryColorById = useMemo(() => {\n    return Object.fromEntries(\n      categories.map((category) => {\n        return [category.id, category.color];\n      }),\n    );\n  }, [categories]);\n\n  const categoryLabelById = useMemo(() => {\n    return Object.fromEntries(\n      categories.map((category) => {\n        return [category.id, category.label];\n      }),\n    );\n  }, [categories]);\n\n  const series = useMemo(() => {\n    if (from == null || to == null) {\n      return [];\n    }\n\n    return toUtcDailyCategorySeries({\n      fromIsoDateTime: from,\n      toIsoDateTime: to,\n      buckets,\n      categories: categoryOrder,\n    });\n  }, [buckets, categoryOrder, from, to]);\n\n  const formatChartValue = (value: number): string => {\n    return formatCurrencyAmount({\n      amount: value,\n      currency,\n    });\n  };\n\n  if (buckets.length === 0) {\n    return <p className={styles.rangeText}>{emptyLabel}</p>;\n  }\n\n  return (\n    <div className={styles.root}>\n      <p className={styles.totalValue}>{formatChartValue(totalAmount)}</p>\n      {from != null && to != null && (\n        <p className={styles.rangeText}>\n          {rangePrefix} <FormattedDate value={from} /> {dateSeparator}{' '}\n          <FormattedDate value={to} />\n        </p>\n      )}\n      <TimeSeriesLineChart\n        ariaLabel={ariaLabel}\n        categoryColorById={categoryColorById}\n        categoryLabel={(category) => {\n          return categoryLabelById[category] ?? category;\n        }}\n        categoryOrder={categoryOrder}\n        formatValue={formatChartValue}\n        series={series}\n      />\n    </div>\n  );\n};\n\nexport default BackofficeBillingUsageChart;\n"],"mappings":";;;;;;;;AAgCA,IAAM,IAAgB,MAET,KAA+B,EAC1C,cACA,YACA,eACA,aACA,eACA,SACA,gBACA,OACA,qBACmD;CACnD,IAAM,IAAgB,QACb,EAAW,KAAK,MACd,EAAS,GAChB,EACD,CAAC,EAAW,CAAC,EAEV,IAAoB,QACjB,OAAO,YACZ,EAAW,KAAK,MACP,CAAC,EAAS,IAAI,EAAS,MAAM,CACpC,CACH,EACA,CAAC,EAAW,CAAC,EAEV,IAAoB,QACjB,OAAO,YACZ,EAAW,KAAK,MACP,CAAC,EAAS,IAAI,EAAS,MAAM,CACpC,CACH,EACA,CAAC,EAAW,CAAC,EAEV,IAAS,QACT,KAAQ,QAAQ,KAAM,OACjB,EAAE,GAGJ,EAAyB;EAC9B,iBAAiB;EACjB,eAAe;EACf;EACA,YAAY;EACb,CAAC,EACD;EAAC;EAAS;EAAe;EAAM;EAAG,CAAC,EAEhC,KAAoB,MACjB,EAAqB;EAC1B,QAAQ;EACR;EACD,CAAC;CAOJ,OAJI,EAAQ,WAAW,IACd,kBAAC,KAAD;EAAG,WAAW;YAAmB;EAAe,CAAA,GAIvD,kBAAC,OAAD;EAAK,WAAW;YAAhB;GACE,kBAAC,KAAD;IAAG,WAAW;cAAoB,EAAiB,EAAY;IAAK,CAAA;GACnE,KAAQ,QAAQ,KAAM,QACrB,kBAAC,KAAD;IAAG,WAAW;cAAd;KACG;KAAY;KAAC,kBAAC,GAAD,EAAe,OAAO,GAAQ,CAAA;;KAAE;KAAe;KAC7D,kBAAC,GAAD,EAAe,OAAO,GAAM,CAAA;KAC1B;;GAEN,kBAAC,GAAD;IACa;IACQ;IACnB,gBAAgB,MACP,EAAkB,MAAa;IAEzB;IACf,aAAa;IACL;IACR,CAAA;GACE"}
+{"version":3,"file":"BackofficeBillingUsageChart.js","names":[],"sources":["../../../../../src/components/backoffice/billing/BackofficeBillingUsageChart.tsx"],"sourcesContent":["import { useMemo, type JSX } from 'react';\nimport { FormattedDate } from '@plumile/ui/atomic/atoms/formatted-date/FormattedDate.js';\nimport { TimeSeriesLineChart } from '@plumile/ui/components/charts/TimeSeriesLineChart.js';\nimport { formatCurrencyAmount } from '@plumile/ui/shared/currencyAmount.js';\nimport { toUtcDailyCategorySeries } from '@plumile/ui/shared/timeSeries.js';\n\nimport * as styles from './backofficeBillingUsageChart.css.js';\n\nexport type BackofficeBillingUsageChartBucket = {\n  readonly day: string;\n  readonly category: string;\n  readonly value: number;\n};\n\nexport type BackofficeBillingUsageChartCategory = {\n  readonly id: string;\n  readonly label: string;\n  readonly color: string;\n};\n\nexport type BackofficeBillingUsageChartProps = {\n  readonly currency: string;\n  readonly totalAmount: number;\n  readonly from: string | null;\n  readonly to: string | null;\n  readonly buckets: readonly BackofficeBillingUsageChartBucket[];\n  readonly categories: readonly BackofficeBillingUsageChartCategory[];\n  readonly emptyLabel: string;\n  readonly rangePrefix: string;\n  readonly ariaLabel: string;\n};\n\nconst dateSeparator = '->';\n\nconst formatBillingAxisValue = (value: number, currency: string): string => {\n  return new Intl.NumberFormat(undefined, {\n    style: 'currency',\n    currency,\n    minimumFractionDigits: 0,\n    maximumFractionDigits: 0,\n  }).format(value);\n};\n\nexport const BackofficeBillingUsageChart = ({\n  ariaLabel,\n  buckets,\n  categories,\n  currency,\n  emptyLabel,\n  from,\n  rangePrefix,\n  to,\n  totalAmount,\n}: BackofficeBillingUsageChartProps): JSX.Element => {\n  const categoryOrder = useMemo(() => {\n    return categories.map((category) => {\n      return category.id;\n    });\n  }, [categories]);\n\n  const categoryColorById = useMemo(() => {\n    return Object.fromEntries(\n      categories.map((category) => {\n        return [category.id, category.color];\n      }),\n    );\n  }, [categories]);\n\n  const categoryLabelById = useMemo(() => {\n    return Object.fromEntries(\n      categories.map((category) => {\n        return [category.id, category.label];\n      }),\n    );\n  }, [categories]);\n\n  const series = useMemo(() => {\n    if (from == null || to == null) {\n      return [];\n    }\n\n    return toUtcDailyCategorySeries({\n      fromIsoDateTime: from,\n      toIsoDateTime: to,\n      buckets,\n      categories: categoryOrder,\n    });\n  }, [buckets, categoryOrder, from, to]);\n\n  const formatChartValue = (value: number): string => {\n    return formatCurrencyAmount({\n      amount: value,\n      currency,\n    });\n  };\n\n  if (buckets.length === 0) {\n    return <p className={styles.rangeText}>{emptyLabel}</p>;\n  }\n\n  return (\n    <div className={styles.root}>\n      <p className={styles.totalValue}>{formatChartValue(totalAmount)}</p>\n      {from != null && to != null && (\n        <p className={styles.rangeText}>\n          {rangePrefix} <FormattedDate value={from} /> {dateSeparator}{' '}\n          <FormattedDate value={to} />\n        </p>\n      )}\n      <TimeSeriesLineChart\n        ariaLabel={ariaLabel}\n        categoryColorById={categoryColorById}\n        categoryLabel={(category) => {\n          return categoryLabelById[category] ?? category;\n        }}\n        categoryOrder={categoryOrder}\n        formatValue={formatChartValue}\n        series={series}\n        yAxis={{\n          min: 0,\n          minTickStep: 1,\n          maxTickCount: 5,\n          formatValue: (value) => {\n            return formatBillingAxisValue(value, currency);\n          },\n        }}\n      />\n    </div>\n  );\n};\n\nexport default BackofficeBillingUsageChart;\n"],"mappings":";;;;;;;;AAgCA,IAAM,IAAgB,MAEhB,KAA0B,GAAe,MACtC,IAAI,KAAK,aAAa,KAAA,GAAW;CACtC,OAAO;CACP;CACA,uBAAuB;CACvB,uBAAuB;CACxB,CAAC,CAAC,OAAO,EAAM,EAGL,KAA+B,EAC1C,cACA,YACA,eACA,aACA,eACA,SACA,gBACA,OACA,qBACmD;CACnD,IAAM,IAAgB,QACb,EAAW,KAAK,MACd,EAAS,GAChB,EACD,CAAC,EAAW,CAAC,EAEV,IAAoB,QACjB,OAAO,YACZ,EAAW,KAAK,MACP,CAAC,EAAS,IAAI,EAAS,MAAM,CACpC,CACH,EACA,CAAC,EAAW,CAAC,EAEV,IAAoB,QACjB,OAAO,YACZ,EAAW,KAAK,MACP,CAAC,EAAS,IAAI,EAAS,MAAM,CACpC,CACH,EACA,CAAC,EAAW,CAAC,EAEV,IAAS,QACT,KAAQ,QAAQ,KAAM,OACjB,EAAE,GAGJ,EAAyB;EAC9B,iBAAiB;EACjB,eAAe;EACf;EACA,YAAY;EACb,CAAC,EACD;EAAC;EAAS;EAAe;EAAM;EAAG,CAAC,EAEhC,KAAoB,MACjB,EAAqB;EAC1B,QAAQ;EACR;EACD,CAAC;CAOJ,OAJI,EAAQ,WAAW,IACd,kBAAC,KAAD;EAAG,WAAW;YAAmB;EAAe,CAAA,GAIvD,kBAAC,OAAD;EAAK,WAAW;YAAhB;GACE,kBAAC,KAAD;IAAG,WAAW;cAAoB,EAAiB,EAAY;IAAK,CAAA;GACnE,KAAQ,QAAQ,KAAM,QACrB,kBAAC,KAAD;IAAG,WAAW;cAAd;KACG;KAAY;KAAC,kBAAC,GAAD,EAAe,OAAO,GAAQ,CAAA;;KAAE;KAAe;KAC7D,kBAAC,GAAD,EAAe,OAAO,GAAM,CAAA;KAC1B;;GAEN,kBAAC,GAAD;IACa;IACQ;IACnB,gBAAgB,MACP,EAAkB,MAAa;IAEzB;IACf,aAAa;IACL;IACR,OAAO;KACL,KAAK;KACL,aAAa;KACb,cAAc;KACd,cAAc,MACL,EAAuB,GAAO,EAAS;KAEjD;IACD,CAAA;GACE"}

package/lib/esm/components/backoffice/detail/BackofficeDetailBadgeRow.js

@@ -8,9 +8,10 @@ var i = ({ items: i }) => {
 	return /* @__PURE__ */ t("div", {
 		className: e,
 		children: i.map((e) => {
-			let n = typeof e.label == "function" ? e.label(a) : e.label;
+			let n = typeof e.label == "function" ? e.label(a) : e.label, i = typeof e.title == "function" ? e.title(a) : e.title;
 			return /* @__PURE__ */ t(r, {
 				tone: e.tone ?? "neutral",
+				title: i,
 				children: n
 			}, e.id);
 		})

package/lib/esm/components/backoffice/detail/BackofficeDetailBadgeRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"BackofficeDetailBadgeRow.js","names":[],"sources":["../../../../../src/components/backoffice/detail/BackofficeDetailBadgeRow.tsx"],"sourcesContent":["/* eslint-disable no-ternary */\nimport { type JSX } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport type { BackofficeBadgeItem } from '@plumile/backoffice-core/types.js';\nimport { Tag } from '@plumile/ui/backoffice/atoms/tag/Tag.js';\n\nimport * as styles from './backofficeDetailBadgeRow.css.js';\n\nexport type BackofficeDetailBadgeRowProps = {\n  items: readonly BackofficeBadgeItem[];\n};\n\nexport const BackofficeDetailBadgeRow = ({\n  items,\n}: BackofficeDetailBadgeRowProps): JSX.Element => {\n  const { t } = useTranslation();\n  return (\n    <div className={styles.row}>\n      {items.map((item) => {\n        const label =\n          typeof item.label === 'function' ? item.label(t) : item.label;\n        return (\n          <Tag key={item.id} tone={item.tone ?? 'neutral'}>\n            {label}\n          </Tag>\n        );\n      })}\n    </div>\n  );\n};\n\nexport default BackofficeDetailBadgeRow;\n"],"mappings":";;;;;AAaA,IAAa,KAA4B,EACvC,eACgD;CAChD,IAAM,EAAE,SAAM,GAAgB;CAC9B,OACE,kBAAC,OAAD;EAAK,WAAW;YACb,EAAM,KAAK,MAAS;GACnB,IAAM,IACJ,OAAO,EAAK,SAAU,aAAa,EAAK,MAAM,EAAE,GAAG,EAAK;GAC1D,OACE,kBAAC,GAAD;IAAmB,MAAM,EAAK,QAAQ;cACnC;IACG,EAFI,EAAK,GAET;IAER;EACE,CAAA"}
+{"version":3,"file":"BackofficeDetailBadgeRow.js","names":[],"sources":["../../../../../src/components/backoffice/detail/BackofficeDetailBadgeRow.tsx"],"sourcesContent":["/* eslint-disable no-ternary */\nimport { type JSX } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport type { BackofficeBadgeItem } from '@plumile/backoffice-core/types.js';\nimport { Tag } from '@plumile/ui/backoffice/atoms/tag/Tag.js';\n\nimport * as styles from './backofficeDetailBadgeRow.css.js';\n\nexport type BackofficeDetailBadgeRowProps = {\n  items: readonly BackofficeBadgeItem[];\n};\n\nexport const BackofficeDetailBadgeRow = ({\n  items,\n}: BackofficeDetailBadgeRowProps): JSX.Element => {\n  const { t } = useTranslation();\n  return (\n    <div className={styles.row}>\n      {items.map((item) => {\n        const label =\n          typeof item.label === 'function' ? item.label(t) : item.label;\n        const title =\n          typeof item.title === 'function' ? item.title(t) : item.title;\n        return (\n          <Tag key={item.id} tone={item.tone ?? 'neutral'} title={title}>\n            {label}\n          </Tag>\n        );\n      })}\n    </div>\n  );\n};\n\nexport default BackofficeDetailBadgeRow;\n"],"mappings":";;;;;AAaA,IAAa,KAA4B,EACvC,eACgD;CAChD,IAAM,EAAE,SAAM,GAAgB;CAC9B,OACE,kBAAC,OAAD;EAAK,WAAW;YACb,EAAM,KAAK,MAAS;GACnB,IAAM,IACJ,OAAO,EAAK,SAAU,aAAa,EAAK,MAAM,EAAE,GAAG,EAAK,OACpD,IACJ,OAAO,EAAK,SAAU,aAAa,EAAK,MAAM,EAAE,GAAG,EAAK;GAC1D,OACE,kBAAC,GAAD;IAAmB,MAAM,EAAK,QAAQ;IAAkB;cACrD;IACG,EAFI,EAAK,GAET;IAER;EACE,CAAA"}

package/lib/esm/components/backoffice/filters/backofficeFilterAction.css.js

@@ -1,3 +1,4 @@
+/* empty css                                                             */
 /* empty css                                      */
 //#region src/components/backoffice/filters/backofficeFilterAction.css.ts
 var e = "hwnq700 txvbqbdsb txvbqbey txvbqbjtp txvbqb17ia txvbqbhnp txvbqbux3 txvbqb2g9 txvbqb1uy txvbqb2et txvbqb17u txvbqb196f txvbqb19d9 txvbqbv txvbqb3f txvbqb7h txvbqb75 txvbqb7t txvbqb1bs9 txvbqb1adl txvbqb1ayh qbwcue0 txvbqb1cb0 txvbqb1cws", t = "txvbqb17h7 txvbqbhmm";

package/lib/esm/components/backoffice/layout/backofficeSidebarActions.css.js

@@ -1,4 +1,3 @@
-/* empty css                                                             */
 /* empty css                                        */
 //#region src/components/backoffice/layout/backofficeSidebarActions.css.ts
 var e = "_1xws1b00 qbwcuej qbwcueh txvbqbdsb txvbqbey txvbqbjtp txvbqb1g5 txvbqb2e3 txvbqb2g9 txvbqb1933 txvbqb19cb txvbqbv txvbqbux3 txvbqb7h txvbqb76 txvbqb7t qbwcuei txvbqb1aey txvbqb1bsa qbwcue4 txvbqb1c2w txvbqb1c9c qbwcue0 txvbqb1cb0 txvbqb1cws txvbqb17hx txvbqbhnc";

package/lib/esm/components/backoffice/shared/BackofficeFormattedCurrency.js

@@ -2,12 +2,13 @@ import { useBackofficeFormats as e } from "../../../i18n/useBackofficeFormats.js
 import { jsx as t } from "react/jsx-runtime";
 //#region src/components/backoffice/shared/BackofficeFormattedCurrency.tsx
 var n = ({ value: n, fallback: r = "-", className: i }) => {
-	let { formatCurrency: a } = e();
+	let { formatCurrency: a, formatCurrencyTitle: o } = e();
 	return n == null ? /* @__PURE__ */ t("span", {
 		className: i,
 		children: r
 	}) : /* @__PURE__ */ t("span", {
 		className: i,
+		title: o(n) ?? void 0,
 		children: a(n)
 	});
 };

package/lib/esm/components/backoffice/shared/BackofficeFormattedCurrency.js.map

@@ -1 +1 @@
-{"version":3,"file":"BackofficeFormattedCurrency.js","names":[],"sources":["../../../../../src/components/backoffice/shared/BackofficeFormattedCurrency.tsx"],"sourcesContent":["import { type JSX, type ReactNode } from 'react';\n\nimport { useBackofficeFormats } from '../../../i18n/useBackofficeFormats.js';\n\nexport type BackofficeFormattedCurrencyProps = {\n  value: number | null | undefined;\n  fallback?: ReactNode;\n  className?: string;\n};\n\nexport const BackofficeFormattedCurrency = ({\n  value,\n  fallback = '-',\n  className,\n}: BackofficeFormattedCurrencyProps): JSX.Element => {\n  const { formatCurrency } = useBackofficeFormats();\n\n  if (value == null) {\n    return <span className={className}>{fallback}</span>;\n  }\n\n  return <span className={className}>{formatCurrency(value)}</span>;\n};\n\nexport default BackofficeFormattedCurrency;\n"],"mappings":";;;AAUA,IAAa,KAA+B,EAC1C,UACA,cAAW,KACX,mBACmD;CACnD,IAAM,EAAE,sBAAmB,GAAsB;CAMjD,OAJI,KAAS,OACJ,kBAAC,QAAD;EAAiB;YAAY;EAAgB,CAAA,GAG/C,kBAAC,QAAD;EAAiB;YAAY,EAAe,EAAM;EAAQ,CAAA"}
+{"version":3,"file":"BackofficeFormattedCurrency.js","names":[],"sources":["../../../../../src/components/backoffice/shared/BackofficeFormattedCurrency.tsx"],"sourcesContent":["import { type JSX, type ReactNode } from 'react';\n\nimport { useBackofficeFormats } from '../../../i18n/useBackofficeFormats.js';\n\nexport type BackofficeFormattedCurrencyProps = {\n  value: number | null | undefined;\n  fallback?: ReactNode;\n  className?: string;\n};\n\nexport const BackofficeFormattedCurrency = ({\n  value,\n  fallback = '-',\n  className,\n}: BackofficeFormattedCurrencyProps): JSX.Element => {\n  const { formatCurrency, formatCurrencyTitle } = useBackofficeFormats();\n\n  if (value == null) {\n    return <span className={className}>{fallback}</span>;\n  }\n\n  return (\n    <span className={className} title={formatCurrencyTitle(value) ?? undefined}>\n      {formatCurrency(value)}\n    </span>\n  );\n};\n\nexport default BackofficeFormattedCurrency;\n"],"mappings":";;;AAUA,IAAa,KAA+B,EAC1C,UACA,cAAW,KACX,mBACmD;CACnD,IAAM,EAAE,mBAAgB,2BAAwB,GAAsB;CAMtE,OAJI,KAAS,OACJ,kBAAC,QAAD;EAAiB;YAAY;EAAgB,CAAA,GAIpD,kBAAC,QAAD;EAAiB;EAAW,OAAO,EAAoB,EAAM,IAAI,KAAA;YAC9D,EAAe,EAAM;EACjB,CAAA"}

package/lib/esm/i18n/useBackofficeFormats.js

@@ -1,23 +1,39 @@
 import { useBackofficeReactTranslation as e } from "./useBackofficeReactTranslation.js";
 //#region src/i18n/useBackofficeFormats.ts
-function t() {
-	let { t } = e();
-	function n(e) {
-		return t("format.number", { value: e });
+var t = {
+	style: "currency",
+	currency: "USD",
+	minimumFractionDigits: 2,
+	maximumFractionDigits: 6
+};
+function n() {
+	let { i18n: n, t: r } = e();
+	function i(e) {
+		return r("format.number", { value: e });
 	}
-	function r(e) {
-		return t("format.currency", { value: e });
+	function a(e) {
+		return r("format.currency", { value: e });
 	}
-	function i(e) {
-		return t("format.percent", { value: e });
+	function o(e) {
+		if (e == null || !Number.isFinite(e)) return null;
+		try {
+			let r = e;
+			return Object.is(e, -0) && (r = 0), new Intl.NumberFormat(n.language, t).format(r);
+		} catch {
+			return null;
+		}
+	}
+	function s(e) {
+		return r("format.percent", { value: e });
 	}
 	return {
-		formatNumber: n,
-		formatCurrency: r,
-		formatPercent: i
+		formatNumber: i,
+		formatCurrency: a,
+		formatCurrencyTitle: o,
+		formatPercent: s
 	};
 }
 //#endregion
-export { t as useBackofficeFormats };
+export { n as useBackofficeFormats };
 
 //# sourceMappingURL=useBackofficeFormats.js.map

package/lib/esm/i18n/useBackofficeFormats.js.map

@@ -1 +1 @@
-{"version":3,"file":"useBackofficeFormats.js","names":[],"sources":["../../../src/i18n/useBackofficeFormats.ts"],"sourcesContent":["import { useBackofficeReactTranslation } from './useBackofficeReactTranslation.js';\n\nexport type BackofficeFormats = {\n  formatNumber: (value: number | null | undefined) => string;\n  formatCurrency: (value: number | null | undefined) => string;\n  formatPercent: (value: number | null | undefined) => string;\n};\n\n/**\n *\n */\nexport function useBackofficeFormats(): BackofficeFormats {\n  const { t } = useBackofficeReactTranslation();\n\n  /**\n   *\n   */\n  function formatNumber(value: number | null | undefined): string {\n    return t('format.number', { value });\n  }\n\n  /**\n   *\n   */\n  function formatCurrency(value: number | null | undefined): string {\n    return t('format.currency', { value });\n  }\n\n  /**\n   *\n   */\n  function formatPercent(value: number | null | undefined): string {\n    return t('format.percent', { value });\n  }\n\n  return { formatNumber, formatCurrency, formatPercent };\n}\n"],"mappings":";;AAWA,SAAgB,IAA0C;CACxD,IAAM,EAAE,MAAM,GAA+B;CAK7C,SAAS,EAAa,GAA0C;EAC9D,OAAO,EAAE,iBAAiB,EAAE,UAAO,CAAC;;CAMtC,SAAS,EAAe,GAA0C;EAChE,OAAO,EAAE,mBAAmB,EAAE,UAAO,CAAC;;CAMxC,SAAS,EAAc,GAA0C;EAC/D,OAAO,EAAE,kBAAkB,EAAE,UAAO,CAAC;;CAGvC,OAAO;EAAE;EAAc;EAAgB;EAAe"}
+{"version":3,"file":"useBackofficeFormats.js","names":[],"sources":["../../../src/i18n/useBackofficeFormats.ts"],"sourcesContent":["import { useBackofficeReactTranslation } from './useBackofficeReactTranslation.js';\n\nexport type BackofficeFormats = {\n  formatNumber: (value: number | null | undefined) => string;\n  formatCurrency: (value: number | null | undefined) => string;\n  formatCurrencyTitle: (value: number | null | undefined) => string | null;\n  formatPercent: (value: number | null | undefined) => string;\n};\n\nconst CURRENCY_TITLE_OPTIONS = {\n  style: 'currency',\n  currency: 'USD',\n  minimumFractionDigits: 2,\n  maximumFractionDigits: 6,\n} as const;\n\n/**\n *\n */\nexport function useBackofficeFormats(): BackofficeFormats {\n  const { i18n, t } = useBackofficeReactTranslation();\n\n  /**\n   *\n   */\n  function formatNumber(value: number | null | undefined): string {\n    return t('format.number', { value });\n  }\n\n  /**\n   *\n   */\n  function formatCurrency(value: number | null | undefined): string {\n    return t('format.currency', { value });\n  }\n\n  /**\n   *\n   */\n  function formatCurrencyTitle(\n    value: number | null | undefined,\n  ): string | null {\n    if (value == null || !Number.isFinite(value)) {\n      return null;\n    }\n    try {\n      let normalizedValue = value;\n      if (Object.is(value, -0)) {\n        normalizedValue = 0;\n      }\n\n      return new Intl.NumberFormat(\n        i18n.language,\n        CURRENCY_TITLE_OPTIONS,\n      ).format(normalizedValue);\n    } catch {\n      return null;\n    }\n  }\n\n  /**\n   *\n   */\n  function formatPercent(value: number | null | undefined): string {\n    return t('format.percent', { value });\n  }\n\n  return { formatNumber, formatCurrency, formatCurrencyTitle, formatPercent };\n}\n"],"mappings":";;AASA,IAAM,IAAyB;CAC7B,OAAO;CACP,UAAU;CACV,uBAAuB;CACvB,uBAAuB;CACxB;AAKD,SAAgB,IAA0C;CACxD,IAAM,EAAE,SAAM,SAAM,GAA+B;CAKnD,SAAS,EAAa,GAA0C;EAC9D,OAAO,EAAE,iBAAiB,EAAE,UAAO,CAAC;;CAMtC,SAAS,EAAe,GAA0C;EAChE,OAAO,EAAE,mBAAmB,EAAE,UAAO,CAAC;;CAMxC,SAAS,EACP,GACe;EACf,IAAI,KAAS,QAAQ,CAAC,OAAO,SAAS,EAAM,EAC1C,OAAO;EAET,IAAI;GACF,IAAI,IAAkB;GAKtB,OAJI,OAAO,GAAG,GAAO,GAAG,KACtB,IAAkB,IAGb,IAAI,KAAK,aACd,EAAK,UACL,EACD,CAAC,OAAO,EAAgB;UACnB;GACN,OAAO;;;CAOX,SAAS,EAAc,GAA0C;EAC/D,OAAO,EAAE,kBAAkB,EAAE,UAAO,CAAC;;CAGvC,OAAO;EAAE;EAAc;EAAgB;EAAqB;EAAe"}