@kanunilabs/datagrid 1.9.8 → 1.9.10

package/dist/styles.css

@@ -510,6 +510,9 @@
   align-items: center;
   flex: none;
   height: 100%;
+  /* No double-tap-to-zoom on a cell: the grid counts the two taps itself and
+     opens the editor (P-7.3). Panning and pinch-zoom stay the browser's. */
+  touch-action: manipulation;
   padding: 0 var(--dg-cell-padding-x);
   border-inline-end: var(--dg-cell-border);
   white-space: nowrap;
@@ -1200,14 +1203,41 @@
 }
 
 .kanuni-datagrid-card-title {
+  display: flex;
+  align-items: center;
+  gap: 6px;
   height: 22px;
   line-height: 22px;
   font-weight: 600;
   white-space: nowrap;
   overflow: hidden;
+}
+
+.kanuni-datagrid-card-title-text {
+  min-width: 0;
+  overflow: hidden;
   text-overflow: ellipsis;
 }
 
+/* `rowStatus.icons` on a card: the glyph the table's status column holds
+   (P-9; the row's marker still runs down the card's edge). */
+.kanuni-datagrid-card-title .kanuni-datagrid-status-icon {
+  flex: none;
+}
+
+/* A card that does something when pressed (P-9). `touch-action: manipulation`
+   drops the double-tap zoom delay, so a tap answers at once. */
+.kanuni-datagrid-card--pressable {
+  cursor: pointer;
+  touch-action: manipulation;
+  -webkit-tap-highlight-color: transparent;
+}
+
+/* `cardView.renderCard`: the app draws the content; the grid keeps the box. */
+.kanuni-datagrid-card--custom {
+  font-size: inherit;
+}
+
 .kanuni-datagrid-card-fields {
   margin: 0;
 }
@@ -2652,6 +2682,13 @@
   position: static !important;
 }
 
+
+/* The printable copy of the grid, made at `beforeprint` so the column headers
+   repeat on every page (P-15; see hooks/printTable.ts). Invisible on screen. */
+.kanuni-datagrid-print-table {
+  display: none;
+}
+
 /* Rules that only make sense once the ink is on paper. */
 @media print {
   /* Release the page around the grid.
@@ -2681,6 +2718,25 @@
     page-break-inside: avoid;
   }
 
+  /* Column headers on every page (P-15): the live canvas gives way to its
+     <table> copy, whose <thead> the browser repeats. Rows never split. */
+  .kanuni-datagrid-print [data-print-clone] {
+    display: none !important;
+  }
+  .kanuni-datagrid-print .kanuni-datagrid-print-table {
+    display: table;
+    border-collapse: collapse;
+    border-spacing: 0;
+  }
+  .kanuni-datagrid-print .kanuni-datagrid-print-table td {
+    padding: 0;
+    border: 0;
+  }
+  .kanuni-datagrid-print .kanuni-datagrid-print-table tr {
+    break-inside: avoid;
+    page-break-inside: avoid;
+  }
+
   /* Chrome and Safari drop background colours by default, which turns the
      header, the group banners and the row striping into undifferentiated white.
      The structure IS the meaning here, so ask for them back. */
@@ -2921,6 +2977,15 @@
   margin: 0;
 }
 
+/* A touch screen: never under 16 px while typing, or iOS Safari zooms the page
+   into the box the moment it takes focus (Tekax 07, P.1 rule c). */
+@media (pointer: coarse) {
+  .kanuni-datagrid-root .kanuni-datagrid-editor:not([type='checkbox']),
+  .kanuni-datagrid-root .kanuni-datagrid-edit-form-input:not([type='checkbox']) {
+    font-size: max(16px, var(--dg-font-size));
+  }
+}
+
 /* Edge to edge of the CELL, not of its padding box.
    `width: 100%` resolves against the content box — the cell minus 2 ×
    --dg-cell-padding-x — and a negative margin only shifts a box, it does not
@@ -2976,6 +3041,20 @@
   border-bottom-color: var(--dg-danger);
 }
 
+/* `lookup.restrictInput` (P-12): a short flash where a refused key landed. No
+   message; the box keeps its text and caret. */
+.kanuni-datagrid-root .kanuni-datagrid-editor--refused {
+  border-bottom-color: var(--dg-danger);
+  animation: kanuni-datagrid-refused 240ms ease-in-out;
+}
+@keyframes kanuni-datagrid-refused {
+  25% { transform: translateX(-2px); }
+  75% { transform: translateX(2px); }
+}
+@media (prefers-reduced-motion: reduce) {
+  .kanuni-datagrid-root .kanuni-datagrid-editor--refused { animation: none; }
+}
+
 /* The cell holding an editor gives up its focus ring — the underline is the
    marker now, and the ring is the other half of the double rectangle.
    It also goes to the plain surface colour: the row underneath may be striped,
@@ -3209,6 +3288,10 @@
 }
 
 .kanuni-datagrid-lookup-item {
+  /* The editor windows the list by the item height it sets inline; the
+     padding has to sit INSIDE it, or each item overlaps the next (and a
+     44 px touch item measured 52). */
+  box-sizing: border-box;
   padding: 4px 8px;
   line-height: 18px;
   white-space: nowrap;
@@ -3217,6 +3300,29 @@
   cursor: pointer;
 }
 
+/* A code + name item (lookup.linkedColumns, P-5.2): the code in a fixed
+   column so the names line up. */
+.kanuni-datagrid-lookup-code {
+  display: inline-block;
+  min-width: 7ch;
+  margin-inline-end: 8px;
+  font-weight: 600;
+  font-variant-numeric: tabular-nums;
+}
+
+/* Touch (pointer: coarse): 44 px items, 16 px text (K-53, P.1 rule c). The
+   height itself is set by the editor, which windows the list by it. */
+.kanuni-datagrid-lookup-popup--touch .kanuni-datagrid-lookup-item {
+  line-height: 36px;
+  font-size: 16px;
+}
+
+/* A function lookup's label still on its way (P-5.1): nothing, not the code. */
+.kanuni-datagrid-lookup-pending {
+  display: inline-block;
+  min-width: 1em;
+}
+
 .kanuni-datagrid-lookup-item--active {
   background: var(--dg-primary);
   color: var(--dg-on-primary);
@@ -3681,14 +3787,30 @@ input[type='checkbox'].kanuni-datagrid-edit-form-input {
   /* The success fill: every palette and scheme sets it, dark ones included. */
   --dg-row-status-saved: var(--dg-success);
   --dg-row-status-error: var(--dg-danger);
+  /* P-2 (2026-10-31). A new row: the success colour — "added", as a diff reads
+     it; a plus glyph tells it from the transient "saved" tick. A pending
+     delete: the muted text colour, so it reads as greyed out and is never
+     mistaken for the red of a refused save. Both stay at 3:1 or more against
+     the row in every packaged scheme and palette (themes.test.ts measures
+     them); an app's theme may set its own. */
+  --dg-row-status-new: var(--dg-success);
+  --dg-row-status-removed: var(--dg-text-muted);
   /* How strongly `tint: true` washes the row. */
   --dg-row-status-tint: 8%;
 }
 
+.kanuni-datagrid-row--status-new {
+  --dg-row-status-color: var(--dg-row-status-new);
+}
+
 .kanuni-datagrid-row--status-changed {
   --dg-row-status-color: var(--dg-row-status-changed);
 }
 
+.kanuni-datagrid-row--status-removed {
+  --dg-row-status-color: var(--dg-row-status-removed);
+}
+
 .kanuni-datagrid-row--status-saving {
   --dg-row-status-color: var(--dg-row-status-saving);
 }
@@ -3730,6 +3852,14 @@ input[type='checkbox'].kanuni-datagrid-edit-form-input {
   );
 }
 
+/* `rowStatus.strike`: a row whose status is `removed` — the grid's pending
+   delete or the app's own status — has its text struck through, in every edit
+   mode. The status glyph cell is left alone. */
+.kanuni-datagrid-row--status-strike .kanuni-datagrid-cell:not(.kanuni-datagrid-status-cell),
+.kanuni-datagrid-row--status-strike .kanuni-datagrid-card {
+  text-decoration: line-through;
+}
+
 /* High contrast drops background colours; the marker is the whole signal,
    so it keeps its own. */
 @media (forced-colors: active) {
@@ -3805,7 +3935,7 @@ input[type='checkbox'].kanuni-datagrid-edit-form-input {
 /* ── Status column (`rowStatus.icons`, 2026-10-16) ───────────
    A glyph per status so it does not rest on colour alone: a dot while
    changed, a turning ring while saving, a tick when saved, a triangle when
-   refused. Drawn as a MASK filled with the status colour, so a palette or a
+   refused, a plus for a new row and a cross for a pending delete (P-2). Drawn as a MASK filled with the status colour, so a palette or a
    scheme recolours it like the marker. The cell exists on every row (an empty
    one where there is no status) so the columns beside it never step. */
 .kanuni-datagrid-status-cell {
@@ -3832,6 +3962,14 @@ input[type='checkbox'].kanuni-datagrid-edit-form-input {
   --dg-row-status-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3.5'/%3E%3C/svg%3E");
 }
 
+.kanuni-datagrid-row--status-new {
+  --dg-row-status-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 2.5v11M2.5 8h11' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E");
+}
+
+.kanuni-datagrid-row--status-removed {
+  --dg-row-status-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5l9 9M12.5 3.5l-9 9' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E");
+}
+
 .kanuni-datagrid-row--status-saving {
   --dg-row-status-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 2a6 6 0 1 1-6 6' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E");
 }
@@ -4244,6 +4382,9 @@ input[type='checkbox'].kanuni-datagrid-edit-form-input {
   /* NOT the accent: gold on white is 1.9:1 and a focus ring has to be seen.
      brand-900 measures 7.0:1 on white. */
   --dg-focus-ring: #6b5119;
+  /* The "saving" marker is the accent elsewhere; gold on the white row is
+     2.4:1, under the 3:1 a status bar needs (P-2 measurement). */
+  --dg-row-status-saving: #6b5119;
   --dg-on-primary: #1c1917;
   --dg-selected-bg: #f3ead3;
   --dg-group-bg: #faf6ed;
@@ -4711,6 +4852,9 @@ input[type='checkbox'].kanuni-datagrid-edit-form-input {
   --dg-scrollbar-thumb: #4c566a;
   --dg-danger: #bf616a;              /* nord11 */
   --dg-danger-text: #d9919a;
+  /* The refused-save marker: nord11 is 2.8:1 on the striped row, under the
+     3:1 a status bar needs (P-2 measurement). */
+  --dg-row-status-error: #d9919a;
   /* nord11 is a muted red, so the label on it has to go further down than the
      usual near-black: #2b1113 measured 4.31:1 and this is 5.17:1. */
   --dg-on-danger: #170709;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kanunilabs/datagrid",
-  "version": "1.9.8",
+  "version": "1.9.10",
   "description": "High-performance data grid for vanilla JavaScript — no framework required. Virtualized rows and columns, a Web Worker pipeline, sorting, filtering, grouping and theming, with a UMD build for script-tag use.",
   "keywords": [
     "data-grid",
@@ -60,7 +60,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@kanunilabs/datagrid-core": "1.10.8"
+    "@kanunilabs/datagrid-core": "1.10.10"
   },
   "devDependencies": {
     "@types/node": "^22.0.0",
@@ -68,7 +68,7 @@
     "jsdom": "^30.0.1",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "@kanunilabs/datagrid-react": "1.8.8",
+    "@kanunilabs/datagrid-react": "1.8.10",
     "@kanunilabs/foundation": "1.0.4"
   },
   "scripts": {