@lotics/ui 47.16.0 → 47.16.1

package/docs/catalog.md

@@ -648,7 +648,10 @@ source (`src/<module>.tsx`/`.ts`) is the API reference.
 - **`markdown.css`** — import once for the web markdown styling.
 - **`format_date`** — `formatDate` / `parseDate` / `toISODate` + `DateFormatStyle` (incl.
   `monthYear` and `quarterYear`, the two period labels).
-- **`format_money`** — `formatMoney` / `formatCompactNumber`.
+- **`format_money`** — `formatMoney` / `formatCompactNumber`. **`compact` abbreviates in the
+  LOCALE's own words**: `vi` gets "486 tr ₫" / "1,28 tỷ ₫", every other locale gets Intl's
+  compact currency ("$1.2M"). `tỷ` and `tr` are Vietnamese words, so a figure under `en-US`
+  never wears one — it reads as a typo, not as a number.
 - **`text_utils`** — text/typography plumbing: `getTextColor` (the TextColor→hex map incl.
   the AA-cleared valence set), the Inter `fontFamily*` stacks, and `getInputTextStyle` /
   `getInputLineHeight` — the 16px-mobile/14px-desktop input contract that stops Safari iOS
@@ -1664,7 +1667,9 @@ source (`src/<module>.tsx`/`.ts`) is the API reference.
   **And before reaching for a verb at all, ask whether the value is simply the field's DEFAULT** —
   a tariff, a list price, the figure a line is created with. Then there is no verb: the field
   already holds it, and clearing the field restores it. A button that re-applies what the field
-  would hold anyway is a control for a state the reader cannot reach. `extra` carries a second control belonging
+  would hold anyway is a control for a state the reader cannot reach. **A flat line's `amount: null` is a cost NOBODY HAS STATED** — an excluded service, a
+  figure the supplier still owes — and prints a dash, never the band's zero, because a service
+  shown at zero reads as free; `0` stays a price somebody set. `extra` carries a second control belonging
   to the charge (how it was paid); `warning` names a problem on the line that has it; `locked`
   turns the editors into values for a settled band and draws no verb of any kind; `empty` speaks for a record nobody has priced
   yet. `formatMoney` is the BAND's, so two lines cannot disagree about a currency, and the `total`

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lotics/ui",
-  "version": "47.16.0",
+  "version": "47.16.1",
   "type": "module",
   "exports": {
     "./accordion": "./src/accordion.tsx",

package/src/charge_lines.tsx

@@ -73,7 +73,11 @@ export interface ChargeLineProps {
   quantity?: number | null;
   unitPrice?: number | null;
   /** Flat line: the amount itself. Ignored when `quantity`/`unitPrice` are set,
-   *  because a derived figure and a typed one cannot both be the truth. */
+   *  because a derived figure and a typed one cannot both be the truth.
+   *  `null` is a cost NOBODY HAS STATED — a supplier's exclusion, a line still
+   *  awaiting a figure — and renders as a dash, never as the band's zero: a
+   *  service printed at zero reads as free. Pass `0` for a price somebody
+   *  actually set to nothing. */
   amount?: number | null;
   onAmountChange?: (next: number | null) => void | Promise<void>;
   /** The same, for a FLAT line's amount. Unconditional and `disabled` when idle. */
@@ -204,6 +208,14 @@ export function ChargeLine(props: ChargeLineProps) {
     : undefined;
   const priced = quantity !== undefined || unitPrice !== undefined;
   const amount = priced ? (quantity ?? 0) * (unitPrice ?? 0) : (props.amount ?? 0);
+  /**
+   * A flat line whose amount is NULL has no figure — a cost nobody has stated
+   * yet, a service the supplier excluded. Read-only it used to print the
+   * band's zero, which says the line is free; the editable spelling of the
+   * same value already showed the placeholder dash. One value cannot render
+   * as two different claims, and of the two only the dash is true.
+   */
+  const unstated = !priced && props.amount == null;
   /** The row's money verb — the unit price's on a priced line, the amount's on a
    *  flat one. A locked band has nothing to act on, so it draws none. */
   const warning = props.warning ? (
@@ -276,8 +288,8 @@ export function ChargeLine(props: ChargeLineProps) {
           answer — and it lands in no column, so the total below closes nothing. */}
       <View style={styles.amountSlot}>
         {priced || locked || !props.onAmountChange ? (
-          <Text size="sm" tabular style={[styles.right, styles.inset]}>
-            {money(amount)}
+          <Text size="sm" tabular color={unstated ? "muted" : undefined} style={[styles.right, styles.inset]}>
+            {unstated ? "—" : money(amount)}
           </Text>
         ) : (
           <InlineNumberInput

package/src/format_money.ts

@@ -1,9 +1,10 @@
 export interface FormatMoneyOptions {
   locale?: string;
   currency?: string;
-  /** Abbreviate for display density: ≥1 tỷ → "1,28 tỷ ₫", ≥1 triệu →
-   * "486 tr ₫". For stat strips/cards where the full figure lives in the
-   * table below — never for the table itself. */
+  /** Abbreviate for display density — in the LOCALE's own words: `vi` gets
+   * "1,28 tỷ ₫" / "486 tr ₫", everywhere else gets Intl's compact currency
+   * ("$1.2M"). For stat strips/cards where the full figure lives in the table
+   * below — never for the table itself. */
   compact?: boolean;
   /** Significant digits below the currency's minor unit. `Intl`'s currency
    *  style floors at that unit — 2 for USD — so a genuine per-unit price like
@@ -14,18 +15,25 @@ export interface FormatMoneyOptions {
 }
 
 /**
- * Compact vi-style magnitude suffixes: ≥1 tỷ → "1,28 tỷ", ≥1 triệu →
- * "486 tr"; smaller values render in full. Bare numbers only — for money,
- * use `formatMoney` with `compact`.
+ * A magnitude abbreviated IN THE READER'S OWN LANGUAGE: `vi` gets its own
+ * words (≥1 tỷ → "1,28 tỷ", ≥1 triệu → "486 tr"), every other locale gets
+ * Intl's compact notation ("1.2M", "486K"). Smaller values render in full.
+ * Bare numbers only — for money, use `formatMoney` with `compact`.
+ *
+ * `tỷ` and `tr` are Vietnamese WORDS, so they belong to a Vietnamese locale
+ * and nowhere else: appending them under `en-US` printed "1 tr USD" on a US
+ * register, which reads as a typo rather than as a number. A locale Intl has
+ * no compact form for falls back to grouped digits — long, and never foreign.
  */
 export function formatCompactNumber(value: number, locale = "vi-VN"): string {
+  if (Math.abs(value) < 1_000_000) return value.toLocaleString(locale);
+  if (!locale.startsWith("vi")) {
+    return value.toLocaleString(locale, { notation: "compact", maximumFractionDigits: 1 });
+  }
   if (Math.abs(value) >= 1_000_000_000) {
     return `${(value / 1_000_000_000).toLocaleString(locale, { maximumFractionDigits: 2 })} tỷ`;
   }
-  if (Math.abs(value) >= 1_000_000) {
-    return `${Math.round(value / 1_000_000).toLocaleString(locale)} tr`;
-  }
-  return value.toLocaleString(locale);
+  return `${Math.round(value / 1_000_000).toLocaleString(locale)} tr`;
 }
 
 /**
@@ -37,6 +45,11 @@ export function formatCompactNumber(value: number, locale = "vi-VN"): string {
 export function formatMoney(value: number, options: FormatMoneyOptions = {}): string {
   const { locale = "vi-VN", currency = "VND", compact = false, maxFractionDigits } = options;
   if (compact && Math.abs(value) >= 1_000_000) {
+    // Outside Vietnamese, Intl abbreviates the CURRENCY itself — "$1.2M" — so
+    // the symbol keeps its place instead of trailing a foreign magnitude word.
+    if (!locale.startsWith("vi")) {
+      return value.toLocaleString(locale, { style: "currency", currency, notation: "compact", maximumFractionDigits: 1 });
+    }
     const suffixed = formatCompactNumber(value, locale);
     return currency === "VND" ? `${suffixed} ₫` : `${suffixed} ${currency}`;
   }