@assure-one/design-system 1.36.0 → 1.38.0

package/codemods/transforms/cm-13-tooltip-delay.mjs

@@ -0,0 +1,99 @@
+/**
+ * CM-13 — `Tooltip delayMs` → `delayDuration` (class A; plan §29 seq 2,
+ * registry `C-TOOLTIP-DELAY`).
+ *
+ * W5-12 made `delayMs` a deprecated alias of Radix's `delayDuration` on the
+ * design-system `Tooltip` (`TooltipProps` in `src/primitives/tooltip.tsx`):
+ * both name the same milliseconds and `delayDuration` wins when both are
+ * given, so the rename is behaviour-neutral and a pure rename — only the
+ * attribute's name is replaced; a literal or a dynamic `delayMs={x}` keeps
+ * its value and its formatting.
+ *
+ * | rule            | registry        | what happens                        |
+ * | --------------- | --------------- | ----------------------------------- |
+ * | `delay-renamed` | C-TOOLTIP-DELAY | `delayMs={…}` → `delayDuration={…}` |
+ *
+ * ## What it leaves alone, and lists under "could not be transformed"
+ *
+ * - An element that passes **both** `delayDuration` and `delayMs`:
+ *   `delayDuration` already wins in the component, and a rename would make a
+ *   duplicate attribute. A human deletes `delayMs`.
+ * - An element with a spread (`<Tooltip delayMs={300} {...props}>`): the
+ *   spread may carry `delayDuration`, and which one wins depends on attribute
+ *   order — renaming the literal could change it.
+ *
+ * Elements already on `delayDuration` are not touched (idempotency). Local
+ * components called Tooltip are not touched; test files are skipped, as by
+ * the scanner that measures C-TOOLTIP-DELAY.
+ */
+import { analyseForms } from "../lib/forms.mjs";
+import { applyEdits, openingOf, renameAttribute } from "../lib/jsx-edit.mjs";
+
+export const meta = {
+  id: "CM-13",
+  title: "Tooltip: delayMs → delayDuration",
+  class: "A",
+  oneShot: false,
+  requires: { codemods: [], dsVersion: null },
+  parses: ["code"],
+  includeTests: false,
+  usesTypeScript: true,
+  usesPostcss: false,
+  registryIds: ["C-TOOLTIP-DELAY"],
+};
+
+/** The design-system component that accepts the deprecated `delayMs` (W5-12). */
+export const DELAYED_COMPONENTS = new Set(["Tooltip"]);
+
+export const LEGACY_PROP = "delayMs";
+export const PROP = "delayDuration";
+
+export function transform(file, { ts }) {
+  const facts = analyseForms(ts, file.source, file.rel);
+  const findings = [];
+  const notTransformed = [];
+  const edits = [];
+
+  for (const el of facts.elements) {
+    if (!el.isDs || !DELAYED_COMPONENTS.has(el.base) || el.component !== el.base) continue;
+    if (!el.props.has(LEGACY_PROP)) continue;
+
+    if (el.props.has(PROP)) {
+      notTransformed.push({
+        line: el.line,
+        reason: "both-names",
+        detail: `<${el.tag}> passes \`${LEGACY_PROP}\` and \`${PROP}\` — \`${PROP}\` already wins; delete \`${LEGACY_PROP}\` by hand`,
+      });
+      continue;
+    }
+    if (el.spread) {
+      notTransformed.push({
+        line: el.line,
+        reason: "spread-props",
+        detail: `<${el.tag} {…}> — the spread may carry \`${PROP}\`; rename by hand once you know it does not`,
+      });
+      continue;
+    }
+
+    const edit = renameAttribute(ts, facts.sf, openingOf(ts, el.node), LEGACY_PROP, PROP);
+    if (!edit) continue;
+    edits.push(edit);
+    findings.push({
+      line: el.props.get(LEGACY_PROP).line,
+      registryId: "C-TOOLTIP-DELAY",
+      rule: "delay-renamed",
+      match: `<${el.tag} ${LEGACY_PROP}>`,
+      component: el.component,
+      action: "applied",
+      gate: null,
+      detail: { from: LEGACY_PROP, to: PROP, value: el.props.get(LEGACY_PROP).text },
+    });
+  }
+
+  return {
+    output: edits.length ? applyEdits(file.source, edits) : file.source,
+    findings,
+    notTransformed,
+    parseErrors: facts.parseErrors,
+  };
+}

package/codemods/transforms/cm-18-data-table-parts.mjs

@@ -0,0 +1,234 @@
+/**
+ * CM-18 — `DataTable*` presentational parts → `Table*` (class A; plan §29
+ * seq 12, registry `C-DT-PARTS`, lands with W6-03).
+ *
+ * W6-03 made the `DataTable*` table parts thin aliases of the `Table*` parts:
+ * one styling source, the same props. Where a part is a 1:1 copy the rename
+ * is mechanical and this codemod applies it — tag, closing tag and the named
+ * import:
+ *
+ * | from              | to            | note                                                        |
+ * | ----------------- | ------------- | ----------------------------------------------------------- |
+ * | `DataTableHead`   | `TableHeader` | `<thead>`                                                    |
+ * | `DataTableBody`   | `TableBody`   | `<tbody>`                                                    |
+ * | `DataTableRow`    | `TableRow`    | `selected` is the same prop                                  |
+ * | `DataTableCell`   | `TableCell`   | same props (`align`, `numeric`, `muted`, `truncate`, `width`)|
+ * | `DataTableHeader` | `TableHead`   | plain, or controlled `sortable sort onSortChange` — `sortable` is dropped because `TableHead` is sortable whenever `sort` is passed |
+ *
+ * What changes for the rendered DOM: the `data-slot` attributes read
+ * `table-*` instead of `data-table-*`, and `TableHead` does not stamp
+ * `scope="col"` (a `<th>` inside `<thead>` is a column header by default).
+ * Classes, geometry and colours are the same — the `DataTable*` parts render
+ * through the `Table*` parts since W6-03.
+ *
+ * ## What it leaves alone, and lists under "could not be transformed"
+ *
+ * - `DataTableHeader sortable` **without** a controlled `sort` (uncontrolled
+ *   sorting, `defaultSort`): `TableHead` has no uncontrolled sort state — the
+ *   consumer wires `sort` from `useDataTable` or its own state.
+ * - `DataTableHeader sortable={expr}`: whether the header is sortable is not
+ *   visible here.
+ * - `DataTableHeader {...props}`: the spread may carry `sortable`.
+ *
+ * Not touched at all (not parallel copies of a `Table*` part, they stay):
+ * `DataTable` (the card frame), `DataTableToolbar`, `DataTableSearch`,
+ * `DataTableSpacer`, `DataTableResultsCount`, `DataTableCellName` /
+ * `DataTableCellMono` / `DataTableCellId` / `DataTableCellDue`,
+ * `DataTableCheckbox`, `DataTablePagination`, and the `DataTable*Props` types.
+ * An aliased import (`DataTableCell as Cell`) and a namespace import are left
+ * alone too. The import specifier is rewritten only when no reference to the
+ * old name remains in the file (a `typeof DataTableCell` keeps it, and the
+ * new name is added next to it). Local components with the same names are
+ * not touched; test files are skipped, as by the scanner that measures
+ * C-DT-PARTS.
+ */
+import { analyseForms } from "../lib/forms.mjs";
+import { applyEdits, openingOf, removeAttribute } from "../lib/jsx-edit.mjs";
+
+export const meta = {
+  id: "CM-18",
+  title: "DataTable* presentational parts → Table* (pure rename where the part is a 1:1 copy)",
+  class: "A",
+  oneShot: false,
+  requires: { codemods: [], dsVersion: null },
+  parses: ["code"],
+  includeTests: false,
+  usesTypeScript: true,
+  usesPostcss: false,
+  registryIds: ["C-DT-PARTS"],
+};
+
+/** `DataTable*` part → the `Table*` part it aliases (src/composites/data-table.tsx, W6-03). */
+export const PART_MAP = {
+  DataTableHead: "TableHeader",
+  DataTableBody: "TableBody",
+  DataTableRow: "TableRow",
+  DataTableCell: "TableCell",
+  DataTableHeader: "TableHead",
+};
+
+export const RULES = {
+  "part-renamed": { action: "applied", severity: "low" },
+};
+
+const DS_PACKAGE = "@assure-one/design-system";
+
+/**
+ * Identifier references to `name` outside its import specifier and outside
+ * JSX tag names — `typeof DataTableCell`, `as={DataTableCell}`, a plain
+ * value use. While one exists the old import must stay.
+ */
+function hasOtherReferences(ts, sf, name) {
+  let found = false;
+  const visit = (node) => {
+    if (found) return;
+    if (ts.isIdentifier(node) && node.text === name) {
+      const parent = node.parent;
+      const isImport = parent && ts.isImportSpecifier(parent);
+      const isTag =
+        parent &&
+        (ts.isJsxOpeningElement(parent) ||
+          ts.isJsxSelfClosingElement(parent) ||
+          ts.isJsxClosingElement(parent)) &&
+        parent.tagName === node;
+      if (!isImport && !isTag) found = true;
+      return;
+    }
+    ts.forEachChild(node, visit);
+  };
+  visit(sf);
+  return found;
+}
+
+export function transform(file, { ts }) {
+  const facts = analyseForms(ts, file.source, file.rel);
+  const sf = facts.sf;
+  const findings = [];
+  const notTransformed = [];
+  const edits = [];
+  /** old local name → new name, for the elements that were renamed */
+  const renamed = new Map();
+  /** old local names that still have an element on them */
+  const remaining = new Set();
+
+  for (const el of facts.elements) {
+    if (!el.isDs || !PART_MAP[el.base] || el.component !== el.base) continue;
+    // An aliased import (`DataTableCell as Cell`): the local name is not the part's.
+    if (el.tag !== el.base) {
+      remaining.add(el.tag);
+      continue;
+    }
+    const to = PART_MAP[el.base];
+    const opening = openingOf(ts, el.node);
+    const inner = [];
+    let sortableDropped = false;
+
+    if (el.base === "DataTableHeader") {
+      const sortable = el.props.get("sortable");
+      if (el.spread) {
+        notTransformed.push({
+          line: el.line,
+          reason: "spread-props",
+          detail: `<${el.tag} {…}> — the spread may carry \`sortable\`; rename to \`TableHead\` by hand once you know it does not`,
+        });
+        remaining.add(el.tag);
+        continue;
+      }
+      if (sortable) {
+        if (sortable.text !== "true") {
+          notTransformed.push({
+            line: el.line,
+            reason: "dynamic-sortable",
+            detail: `<${el.tag} sortable={…}> — whether the header sorts is not visible here; \`TableHead\` sorts whenever \`sort\` is passed`,
+          });
+          remaining.add(el.tag);
+          continue;
+        }
+        if (!el.props.has("sort") || el.props.has("defaultSort")) {
+          notTransformed.push({
+            line: el.line,
+            reason: "uncontrolled-sort",
+            detail: `<${el.tag} sortable> without a controlled \`sort\` — \`TableHead\` has no uncontrolled sort state; wire \`sort\` + \`onSortChange\` (from \`useDataTable\`) first`,
+          });
+          remaining.add(el.tag);
+          continue;
+        }
+        const drop = removeAttribute(ts, sf, opening, "sortable");
+        if (drop) {
+          inner.push(drop);
+          sortableDropped = true;
+        }
+      } else if (el.props.has("defaultSort")) {
+        notTransformed.push({
+          line: el.line,
+          reason: "uncontrolled-sort",
+          detail: `<${el.tag} defaultSort> — \`TableHead\` has no uncontrolled sort state`,
+        });
+        remaining.add(el.tag);
+        continue;
+      }
+    }
+
+    inner.push({ pos: opening.tagName.getStart(sf), end: opening.tagName.getEnd(), text: to });
+    if (ts.isJsxElement(el.node)) {
+      const closing = el.node.closingElement.tagName;
+      inner.push({ pos: closing.getStart(sf), end: closing.getEnd(), text: to });
+    }
+    edits.push(...inner);
+    renamed.set(el.base, to);
+    findings.push({
+      line: el.line,
+      registryId: "C-DT-PARTS",
+      rule: "part-renamed",
+      match: `<${el.tag}>`,
+      component: el.component,
+      action: "applied",
+      gate: null,
+      severity: RULES["part-renamed"].severity,
+      detail: { from: el.base, to, sortableDropped },
+    });
+  }
+
+  // The import: each renamed name becomes its `Table*` part when nothing else
+  // in the file still refers to it; otherwise the new name is added next to it.
+  if (renamed.size) {
+    for (const stmt of sf.statements) {
+      if (!ts.isImportDeclaration(stmt) || !ts.isStringLiteral(stmt.moduleSpecifier)) continue;
+      const spec = stmt.moduleSpecifier.text;
+      if (spec !== DS_PACKAGE && !spec.startsWith(`${DS_PACKAGE}/`)) continue;
+      const bindings = stmt.importClause?.namedBindings;
+      if (!bindings || !ts.isNamedImports(bindings)) continue;
+      const present = new Set(bindings.elements.map((e) => e.name.text));
+      const list = bindings.elements;
+      for (const [from, to] of renamed) {
+        const index = list.findIndex((e) => !e.propertyName && e.name.text === from);
+        if (index < 0) continue;
+        const element = list[index];
+        const keep = remaining.has(from) || hasOtherReferences(ts, sf, from);
+        if (keep) {
+          if (!present.has(to)) {
+            edits.push({ pos: element.getEnd(), text: `, ${to}` });
+            present.add(to);
+          }
+          continue;
+        }
+        if (present.has(to)) {
+          // `TableCell` is already imported: the old specifier goes.
+          const fromPos = index === 0 ? element.getStart(sf) : list[index - 1].getEnd();
+          const toPos = index === 0 && list.length > 1 ? list[1].getStart(sf) : element.getEnd();
+          edits.push({ pos: fromPos, end: toPos, text: "" });
+        } else {
+          edits.push({ pos: element.getStart(sf), end: element.getEnd(), text: to });
+          present.add(to);
+        }
+      }
+    }
+  }
+
+  return {
+    output: edits.length ? applyEdits(file.source, edits) : file.source,
+    findings,
+    notTransformed,
+    parseErrors: facts.parseErrors,
+  };
+}