@lotics/ui 46.8.1 → 46.8.2

package/docs/catalog.md

@@ -1391,9 +1391,22 @@ source (`src/<module>.tsx`/`.ts`) is the API reference.
   and not interchangeable with it: a ledger has nothing to type into and this has no notion of
   adjustments. A charge is ONE line — `quantity`/`unitPrice` derive the amount and the amount is
   never typed; leave both out and the `amount` itself becomes the editor (`amountActions` puts a
-  list price one tap away, `unitPriceActions` a rate). Verbs sit BESIDE the field, never inside
-  it, and the row's own verb (`action`, usually removal) sits in a slot held open on every row —
-  both so the money column cannot move between rows. `extra` carries a second control belonging
+  list price one tap away, `unitPriceActions` a rate). **A verb is named for the ACT, never for the
+  value it would set** — label one with the target figure and every row already at that figure
+  prints the same number twice in a row (three times, once the derived amount agrees), which is the
+  normal state wherever the figures are pre-filled from the same source the verb applies. A fixed
+  label also keeps its width equal across rows, which is what the pass-unconditionally rule exists
+  to protect; put the figure in the accessible name if it is worth announcing. **A money verb renders
+  INSIDE the field it acts on**, on that control's own surface — an `InlineButton` is an inner
+  button and is never a thing standing on its own beside the control it belongs to. As a sibling it
+  also takes its width out of the NAME's column, which is how a charge called "Vệ sinh bến bãi"
+  renders as "Vệ sinh b…". The row's own verb (`action`, usually removal) is the exception that
+  proves it: it belongs to the ROW rather than to any one figure, so it sits in a slot of its own,
+  held open on every row so the money column cannot move between them.
+  **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
   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/examples/tpl_money.tsx

@@ -411,14 +411,19 @@ export function TplMoney() {
           unitPrice={l.unitPrice}
           onQuantityChange={(v) => patchLine(l.key, { quantity: v })}
           onUnitPriceChange={(v) => patchLine(l.key, { unitPrice: v })}
-          /* the rate card's ceiling, one tap, BESIDE the field it fills */
-          /* Unconditional + `disabled`, never conditional: a verb passed only when it
+          /* The rate card's ceiling, one tap, ON the field it fills — an
+             InlineButton is an inner button and never stands on its own beside
+             the control it acts on.
+             Named for the ACT, with the figure in the accessible name: a verb
+             labelled with the value it would set prints that value twice on
+             every row already holding it.
+             Unconditional + `disabled`, never conditional: a verb passed only when it
              has work makes the field narrower on the rows that carry it, so those rows
              stop sharing this money column with the rest. */
           unitPriceActions={
             <InlineButton
-              title={money(CEILING_RATE)}
-              accessibilityLabel="Apply the ceiling rate"
+              title="Ceiling"
+              accessibilityLabel={`Apply the ceiling rate of ${money(CEILING_RATE)}`}
               disabled={l.key !== "runs" || l.unitPrice === CEILING_RATE}
               onPress={() => patchLine(l.key, { unitPrice: CEILING_RATE })}
             />
@@ -714,14 +719,9 @@ export function TplMoney() {
                               placeholder="—"
                               accessibilityLabel={`Amount for ${c.label}`}
                               /* The list price, one tap, ON the field it fills —
-                                 and this is the fork from `ChargeLines`, which
-                                 puts the same verb BESIDE the field. The
-                                 discriminator is what the field sits in: here it
-                                 is a form row whose value column grows, so a verb
-                                 on the field's own surface moves nothing. In a
-                                 right-aligned money COLUMN it would eat the
-                                 field's width and slide the figure off the
-                                 column its neighbours are on. */
+                                 the same placement `ChargeLines` uses, because a
+                                 verb belongs to the control it acts on wherever
+                                 that control sits. */
                               actions={
                                 <InlineButton
                                   title={money(c.standard)}

package/package.json

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

package/src/charge_lines.tsx

@@ -246,16 +246,16 @@ export function ChargeLine(props: ChargeLineProps) {
             placeholder="—"
             align="right"
             accessibilityLabel={words.unitPrice(label)}
+            /* INSIDE the field, on its own surface — an InlineButton is an inner
+               button, never a thing standing on its own beside the control it
+               acts on. Rendered as a sibling it also takes its width out of the
+               NAME's column, which is how a charge called "Vệ sinh bến bãi" came
+               to render as "Vệ sinh b...". */
+            actions={unitPriceActions}
           />
         )}
       </View>
       )}
-      {/* BESIDE the price field, never inside it: a verb inside eats the field's
-          width, so the figure slides left and a row carrying a one-tap rate stops
-          sharing this column with a row that has none. Width is the verb's own —
-          the contract is that a caller passes it on every row and DISABLES it
-          where it has nothing to do, which is what keeps the rows equal. */}
-      {!priced || locked ? null : unitPriceActions}
       {/* The amount ENDS the expression it derives from. Put it on a second
           line and the reader parses left to right, then jumps back to find the
           answer — and it lands in no column, so the total below closes nothing. */}
@@ -273,13 +273,11 @@ export function ChargeLine(props: ChargeLineProps) {
             placeholder="—"
             align="right"
             accessibilityLabel={words.amount(label)}
+            /* The flat line's twin, and INSIDE its field for the same reason. */
+            actions={amountActions}
           />
         )}
       </View>
-      {/* The flat line's twin of `unitPriceActions`, on the figure a flat line
-          actually edits — its amount. Same contract: pass it on every row and
-          disable it where it has nothing to do. */}
-      {priced || locked ? null : amountActions}
       {/* Held open whether or not this row has a verb, so the money column does
           not shift between a row that can be removed and one that cannot. */}
       <View style={styles.actionSlot}>{locked ? null : action}</View>
@@ -319,7 +317,13 @@ export function ChargeLine(props: ChargeLineProps) {
     <View>
     <View style={styles.row}>
       <View style={styles.grow}>
-        <Text size="sm" numberOfLines={1}>
+        {/* The name may take a SECOND line rather than lose a word. The fork
+            threshold is measured on the band, but what actually runs out is the
+            room LEFT for the name — and a money verb takes another slice of it,
+            so a band can sit comfortably above the fork width and still have
+            under 100px for a charge called "Vệ sinh bến bãi". Capped at two so a
+            pathological name cannot push the arithmetic down the page. */}
+        <Text size="sm" numberOfLines={2}>
           {label}
         </Text>
         {props.extra ? <View style={styles.extra}>{props.extra}</View> : null}