@jielga/tmdatagrid 1.0.0 → 1.0.2

package/src/tmdatagrid/components/TMDataGridSearch.tsx

@@ -10,7 +10,7 @@ export type TMDataGridSearchProps = {
   placeholder?: string;
   /**
    * How long typing pauses before the filter is applied, in ms. Defaults to
-   * 250. `0` writes on every keystroke — what the tests use, and fine for
+   * 250. `0` writes on every keystroke - what the tests use, and fine for
    * small client-side data sets.
    */
   debounce?: number;
@@ -19,7 +19,7 @@ export type TMDataGridSearchProps = {
 };
 
 /**
- * Quick search over every column — a debounced input writing the table's
+ * Quick search over every column - a debounced input writing the table's
  * `globalFilter` state through the `"includesString"` filter the grid
  * configures by default.
  *
@@ -32,12 +32,12 @@ export type TMDataGridSearchProps = {
  * ```
  *
  * Renders nothing under `enableGlobalFilter: false`. Columns opt out with
- * their own `enableGlobalFilter: false` — the generated lanes already do.
+ * their own `enableGlobalFilter: false` - the generated lanes already do.
  *
  * The state is TanStack's `globalFilter`, so everything around it comes free:
  * `manualFiltering` grids forward it to the server, and it is one of the
  * persisted `data` slices. A grid that wants its own input entirely writes
- * `table.setGlobalFilter` itself — this component is only the built-in one.
+ * `table.setGlobalFilter` itself - this component is only the built-in one.
  */
 export function TMDataGridSearch({
   placeholder,
@@ -60,7 +60,7 @@ export function TMDataGridSearch({
   // for an external change that should overwrite what is being typed.
   const lastWrittenRef = useRef(globalFilter);
 
-  // External writes — a consumer's `setGlobalFilter`, a persistence restore —
+  // External writes - a consumer's `setGlobalFilter`, a persistence restore -
   // win over the draft; the input is a mirror, not an owner.
   useEffect(() => {
     if (globalFilter === lastWrittenRef.current) return;

package/src/tmdatagrid/components/TMDataGridSelectColumn.tsx

@@ -19,7 +19,7 @@ export const SELECT_COLUMN_ID = "__select__";
  * the selection off the render they were handed.
  *
  * A cell is rendered by `flexRender`, which mounts the cell function as its own
- * component — but the body cell above it keeps the same props across a
+ * component - but the body cell above it keeps the same props across a
  * selection change (row, column and layout identities all survive it), so the
  * React Compiler reuses the memoized element and the subtree never re-renders.
  * The row highlight would update, from state `TMDataGridTable` subscribes to,
@@ -59,7 +59,7 @@ function SelectAllCheckbox<TData extends RowData>({
  * feature flags rather than `table.options.enableMultiRowSelection` directly:
  * the flags are re-derived from a fresh object every render, so the switch
  * cannot be cached along with a `table` identity that survives an options
- * change — the same reason the rest of the chrome reads them. See
+ * change - the same reason the rest of the chrome reads them. See
  * readFeatureFlags.
  */
 function SelectAllHeader<TData extends RowData>({
@@ -78,10 +78,10 @@ function SelectRowCheckbox<TData extends RowData>({
   row: Row<TMDataGridFeatures, TData>;
 }) {
   // Cells render inside the grid's provider, so the checkbox can reach the
-  // chrome store — it needs the shift-click pivot, and the feature flags to know
+  // chrome store - it needs the shift-click pivot, and the feature flags to know
   // which row model a range is measured over.
   const { ui, features, labels } = useTMDataGridContext();
-  // Out of the tab order once the grid has a cell cursor — see
+  // Out of the tab order once the grid has a cell cursor - see
   // useCellControlTabIndex. Enter on the lane still steps in, and Space on any
   // cell of the row ticks it.
   const tabIndex = useCellControlTabIndex();
@@ -90,7 +90,7 @@ function SelectRowCheckbox<TData extends RowData>({
   // A group row is never selected by id: `rowSelection` only ever holds the
   // leaves, and TanStack's `getIsSelected()` is a plain lookup in that map. So
   // a group asks about its descendants instead, which is also the honest
-  // reading — the box means "all of these", and it goes indeterminate as soon
+  // reading - the box means "all of these", and it goes indeterminate as soon
   // as that stops being true.
   const selected = useSelector(row.table.store, () =>
     isGroupRow ? row.getIsAllSubRowsSelected() : row.getIsSelected(),
@@ -117,7 +117,7 @@ function SelectRowCheckbox<TData extends RowData>({
       checked={selected}
       disabled={selectableIds.length === 0}
       indeterminate={someSelected && !selected}
-      // Every tick goes through the resolver, shift held or not — plain becomes
+      // Every tick goes through the resolver, shift held or not - plain becomes
       // a toggle that moves the pivot, so a later shift-click extends from the
       // box the user last touched.
       //
@@ -138,7 +138,7 @@ function SelectRowCheckbox<TData extends RowData>({
             extend: isMouse && native.shiftKey,
           },
           selection: row.table.store.state.rowSelection,
-          // A checkbox is only ever additive — ticking one has never cleared
+          // A checkbox is only ever additive - ticking one has never cleared
           // the others, so `canReplaceSelection` stays false whatever is held.
           canReplaceSelection: false,
         });
@@ -168,7 +168,7 @@ export function createSelectColumn<TData extends RowData>(
       enableOrdering: false,
     },
     // A system lane: as wide as the control it holds and no wider. Fixed at
-    // every scale — the control does not grow with the font size, so neither
+    // every scale - the control does not grow with the font size, so neither
     // should its track.
     size: 36,
     minSize: 36,

package/src/tmdatagrid/components/TMDataGridTable.module.css

@@ -34,12 +34,12 @@
 }
 
 /* The scrolled-under shadow: a soft band under the header, only while body
-   rows are actually beneath it. On the last header row — the header/body
-   boundary — not on every stacked group row. A scroll-driven animation, like
+   rows are actually beneath it. On the last header row - the header/body
+   boundary - not on every stacked group row. A scroll-driven animation, like
    the pinned-lane gradients: the shadow tracks the scroll on the compositor
    with no listener and no render, and an inactive timeline (nothing to
    scroll) leaves `opacity: 0` standing, so a grid that fits shows nothing.
-   Where unsupported there is simply no shadow — the header's border already
+   Where unsupported there is simply no shadow - the header's border already
    draws the boundary. */
 .headerRow[data-dg-header-last]::after {
   content: "";
@@ -97,7 +97,7 @@
 /* A group row takes no background of its own. Collapsed, every row on screen is
    a group row, so a tint would grey out the whole grid and read as if
    everything were selected. The bold label and the chevron carry the
-   distinction instead — and `--dg-row-group-bg` is there for a consumer who
+   distinction instead - and `--dg-row-group-bg` is there for a consumer who
    wants the tint back. Declared before the selection rules, so a selected or
    highlighted group still reads as one. */
 .bodyRow[data-grouped="true"] {
@@ -114,7 +114,7 @@
 
 /* Being selected and being painted for it are separate: a row is always
    `data-selected`, but only takes the background when `showSelectedBackground`
-   is on — the default under `"row"`, off with checkboxes. */
+   is on - the default under `"row"`, off with checkboxes. */
 .bodyRow[data-selected-bg="true"] {
   --row-bg: var(--dg-row-selected-bg);
 }
@@ -138,19 +138,19 @@
   outline-offset: -2px;
 }
 
-/* Clipping lives on .cellContent, not here — a pinned cell has to let its
+/* Clipping lives on .cellContent, not here - a pinned cell has to let its
    boundary gradient escape past its own right/left edge. */
 .bodyCell {
   display: flex;
   align-items: center;
   padding: 0 var(--dg-padding);
   border-bottom: 1px solid var(--mantine-color-default-border);
-  /* Inherited from .bodyRow — sticky cells need an opaque background. */
+  /* Inherited from .bodyRow - sticky cells need an opaque background. */
   background-color: var(--row-bg);
   font-size: var(--dg-font-size);
 }
 
-/* A control lane — the checkbox, the details chevron — is a fixed 36px track
+/* A control lane - the checkbox, the details chevron - is a fixed 36px track
    holding a control of a known width, not text that can ellipsize. Cell padding
    is sized for text and grows with the scale, so at `xl` its 18px a side left
    12px for a 16px box and the checkbox was clipped. The lane centres its
@@ -185,8 +185,8 @@
    positioned against a scrolling grid with sticky lanes in it.
 
    Four shadows are always laid down and each is transparent until its edge
-   says otherwise. `box-shadow` does not accumulate across rules — a second
-   declaration replaces the first — so the alternative is one rule per corner
+   says otherwise. `box-shadow` does not accumulate across rules - a second
+   declaration replaces the first - so the alternative is one rule per corner
    combination, and a cell can be on any of fifteen of them. */
 .bodyCell[data-selected="true"] {
   --dg-edge-top: transparent;
@@ -219,7 +219,7 @@
 /* The cell the keyboard is on, under `cellSelection`.
 
    Painted from `data-focused` rather than `:focus-visible`, because the ring
-   has to stay while the focus steps into a control inside the cell — that is
+   has to stay while the focus steps into a control inside the cell - that is
    still where the arrow keys resume from. The offset keeps it inside the
    cell's own box, so a pinned neighbour cannot clip it. */
 .bodyCell[data-focused="true"] {
@@ -275,7 +275,7 @@
   border-right-color: var(--mantine-primary-color-filled);
 }
 
-/* Invalid wins over dirty — a cell is usually both. */
+/* Invalid wins over dirty - a cell is usually both. */
 .bodyCell[data-invalid]::after {
   border-top-color: var(--mantine-color-error);
   border-right-color: var(--mantine-color-error);
@@ -295,7 +295,7 @@
 }
 
 /* The panel an expanded row opens. Its own grid row inside .bodyRow, spanning
-   every column track — so it is measured together with the row above it.
+   every column track - so it is measured together with the row above it.
 
    It takes `--row-bg` rather than a colour of its own: the panel belongs to its
    row, and a selected or highlighted row whose panel stayed white would read as
@@ -330,7 +330,7 @@
 }
 
 /* Marked deleted under batch: struck through and inert until submitAll
-   reports it. Interaction off wholesale — a row about to go away must not
+   reports it. Interaction off wholesale - a row about to go away must not
    keep taking edits. */
 .bodyRow[data-deleted="true"] {
   text-decoration: line-through;
@@ -338,7 +338,7 @@
   pointer-events: none;
 }
 
-/* The entry block — one row per edit.addRow(), under the header on the same
+/* The entry block - one row per edit.addRow(), under the header on the same
    subgrid tracks as everything else. The *block* is the sticky element, not
    the rows: sticky siblings would all compete for the same `top` and stack
    onto one spot, while a single sticky wrapper lets its rows flow normally
@@ -359,7 +359,7 @@
   grid-template-columns: subgrid;
 }
 
-/* The pinned edge blocks — user-pinned rows held at the top or bottom of the
+/* The pinned edge blocks - user-pinned rows held at the top or bottom of the
    body, on the entry block's sticky mechanics: the block is the sticky
    element, its rows flow normally inside it. The top block stacks under the
    entry block when both exist; `--dg-entry-height` is measured only then, so
@@ -417,7 +417,7 @@
 
 /* The matched slice of a cell's text, while `enableMatchHighlighting` is on
    and a contains-family filter or the quick search is active. `mark` resets
-   the browser's default so the colour is the grid's to state — override with
+   the browser's default so the colour is the grid's to state - override with
    `--dg-match-highlight-bg` on the grid. */
 .matchHighlight {
   background-color: var(
@@ -428,7 +428,7 @@
   border-radius: 2px;
 }
 
-/* The summary row — one sticky row of column footers along the bottom edge,
+/* The summary row - one sticky row of column footers along the bottom edge,
    rendered only while at least one column defines `footer`. Same subgrid
    placement as the header, so its cells sit exactly on the body's tracks. */
 .summaryRow {