@dnax/ui 0.0.66 → 0.0.69

package/lib/spreadsheet.test.ts

@@ -6,6 +6,10 @@ import {
   isBlankValue,
   isoAddDays,
   shiftFormulaRefs,
+  functionQueryAt,
+  rankSuggestions,
+  functionCallAt,
+  signatureArgs,
   csvEscape,
   csvSplitLine,
   parseCsv,
@@ -44,6 +48,112 @@ describe("shiftFormulaRefs (autofill)", () => {
   it("laisse les valeurs sans lettres intactes", () => {
     expect(shiftFormulaRefs("=1+2", 1, 1)).toBe("=1+2")
   })
+  it("ne touche pas aux littéraux de chaîne", () => {
+    expect(shiftFormulaRefs('=IF(A1>0,"A1","x")', 1, 0)).toBe('=IF(A2>0,"A1","x")')
+    expect(shiftFormulaRefs("=CONCAT('B2',A1)", 0, 1)).toBe("=CONCAT('B2',B1)")
+  })
+  it("ne confond pas un identifiant avec une référence", () => {
+    expect(shiftFormulaRefs("=LOG10(A1)", 1, 0)).toBe("=LOG10(A2)")
+    expect(shiftFormulaRefs("=price1+A1", 1, 0)).toBe("=price1+A2")
+    expect(shiftFormulaRefs("=A1:price2", 1, 0)).toBe("=A2:price2")
+  })
+})
+
+describe("functionQueryAt (autocomplétion fx)", () => {
+  it("rend l'identifiant en cours de frappe, en minuscules", () => {
+    expect(functionQueryAt("=SU")).toBe("su")
+    expect(functionQueryAt("=sum(")).toBe("")
+    expect(functionQueryAt("=SUM(A1)+IF")).toBe("if")
+  })
+
+  it("ne suggère rien hors d'une formule ou dans une chaîne", () => {
+    expect(functionQueryAt("SUM")).toBe("")
+    expect(functionQueryAt('="hello wor')).toBe("")
+    expect(functionQueryAt("='hello wor")).toBe("")
+  })
+
+  it("ne suggère pas au milieu d'une référence ou d'une plage", () => {
+    expect(functionQueryAt("=A1", 2)).toBe("")
+    expect(functionQueryAt("=A1:B")).toBe("")
+    expect(functionQueryAt("=$AB")).toBe("")
+    expect(functionQueryAt("=A1+B")).toBe("b")
+    expect(functionQueryAt("=SUM(A")).toBe("a")
+  })
+
+  it("suit le curseur, pas seulement la fin du texte", () => {
+    expect(functionQueryAt("=SU+1", 3)).toBe("su")
+    expect(functionQueryAt("=SU+1", 5)).toBe("")
+  })
+})
+
+describe("rankSuggestions (autocomplétion)", () => {
+  const items = [
+    { name: "SUM" },
+    { name: "SUMIF" },
+    { name: "SUMPRODUCT" },
+    { name: "MID" },
+    { name: "MEDIAN" },
+    { name: "IF" },
+    { name: "IFS" },
+  ]
+
+  it("classe égalité > préfixe, puis nom le plus court", () => {
+    expect(rankSuggestions(items, "sum").map((i) => i.name)).toEqual([
+      "SUM",
+      "SUMIF",
+      "SUMPRODUCT",
+    ])
+    expect(rankSuggestions(items, "if").map((i) => i.name)).toEqual(["IF", "IFS", "SUMIF"])
+  })
+
+  it("trouve une sous-chaîne", () => {
+    expect(rankSuggestions(items, "edian").map((i) => i.name)).toEqual(["MEDIAN"])
+    expect(rankSuggestions(items, "ia").map((i) => i.name)).toEqual(["MEDIAN"])
+  })
+
+  it("trouve une sous-séquence (fuzzy)", () => {
+    expect(rankSuggestions(items, "sm").map((i) => i.name)).toEqual([
+      "SUM",
+      "SUMIF",
+      "SUMPRODUCT",
+    ])
+  })
+
+  it("respecte la limite et ignore une requête vide", () => {
+    expect(rankSuggestions(items, "s", 1)).toHaveLength(1)
+    expect(rankSuggestions(items, "")).toEqual([])
+    expect(rankSuggestions(items, "zzz")).toEqual([])
+  })
+})
+
+describe("functionCallAt / signatureArgs (aide à l'argument)", () => {
+  const known = ["SUM", "IF", "MAX"]
+
+  it("détecte la fonction et l'index de l'argument courant", () => {
+    expect(functionCallAt("=SUM(", 5, known)).toEqual({ name: "sum", index: 0 })
+    expect(functionCallAt("=SUM(A1,", 8, known)).toEqual({ name: "sum", index: 1 })
+    expect(functionCallAt("=IF(A1>0,", 9, known)).toEqual({ name: "if", index: 1 })
+  })
+
+  it("prend la fonction la plus interne", () => {
+    expect(functionCallAt("=SUM(IF(A1>0,", 13, known)).toEqual({ name: "if", index: 1 })
+  })
+
+  it("ignore les virgules des chaînes et les appels fermés", () => {
+    expect(functionCallAt('=IF(A1,"x,y",', 7, known)).toEqual({ name: "if", index: 1 })
+    expect(functionCallAt('=IF(A1,"x,y",', 13, known)).toEqual({ name: "if", index: 2 })
+    expect(functionCallAt("=A1+B1", 6, known)).toBeNull()
+    expect(functionCallAt("=SUM(A1)", 9, known)).toBeNull()
+  })
+
+  it("signatureArgs découpe les paramètres", () => {
+    expect(signatureArgs("range, criteria, [sum_range]")).toEqual([
+      "range",
+      "criteria",
+      "[sum_range]",
+    ])
+    expect(signatureArgs("")).toEqual([])
+  })
 })
 
 describe("dates ISO", () => {

package/lib/spreadsheet.ts

@@ -26,14 +26,213 @@ export const isBlankValue = (v: any): boolean =>
 /**
  * Décale les références A1 non absolues d'une formule de (dr, dc) —
  * plages incluses, `$` préservés (copie / autofill).
+ *
+ * Les **littéraux de chaîne** sont laissés intacts (`"A1"` reste `"A1"`) et les
+ * **identifiants** contenant des chiffres ne sont pas pris pour des références
+ * (`LOG10(...)`, `price1`…).
  */
 export const shiftFormulaRefs = (src: string, dr: number, dc: number): string =>
-  src.replace(
+  splitFormulaSegments(src)
+    .map((segment) => (segment.code ? shiftCodeRefs(segment.text, dr, dc) : segment.text))
+    .join("")
+
+/**
+ * Requête de suggestion de **fonction** à la position du curseur.
+ *
+ * Ne suggère que si le curseur est en train de taper un identifiant de fonction :
+ * hors littéral de chaîne, commençant un token (`=`, `(`, `,`, opérateur, espace…)
+ * et **pas** au milieu d'une référence de cellule (`A` devant `1`). Retourne `""`
+ * quand il n'y a rien à suggérer (ex. `=SUM(`).
+ */
+export function functionQueryAt(text: string, caret: number = text.length): string {
+  if (!text.trim().startsWith("=")) return ""
+  const end = Math.max(0, Math.min(caret, text.length))
+
+  // Curseur dans une chaîne littérale → aucune suggestion
+  let quote = ""
+  for (let i = 0; i < end; i++) {
+    const ch = text[i]!
+    if (quote) {
+      if (ch === quote) {
+        if (text[i + 1] === quote) {
+          i++
+          continue
+        }
+        quote = ""
+      }
+      continue
+    }
+    if (ch === '"' || ch === "'") quote = ch
+  }
+  if (quote) return ""
+
+  let start = end
+  while (start > 0 && /[A-Za-z]/.test(text[start - 1]!)) start--
+  if (start === end) return ""
+  // « A » devant « 1 » : référence de cellule en cours de frappe, pas une fonction
+  if (/[0-9]/.test(text[end] ?? "")) return ""
+  // Doit commencer un token (évite `A1:B`, `$AB`, `sheet!SUM`…)
+  const before = start > 0 ? text[start - 1]! : ""
+  if (before && !/[=(,;\s+\-*/^%&<>]/.test(before)) return ""
+  return text.slice(start, end).toLowerCase()
+}
+
+/** Pose d'une sous-séquence : les lettres de `query` apparaissent dans l'ordre. */
+const isSubsequence = (query: string, name: string): boolean => {
+  let i = 0
+  for (const ch of name) {
+    if (ch === query[i]) i++
+    if (i === query.length) return true
+  }
+  return query.length === 0
+}
+
+/**
+ * Classe des suggestions par pertinence :
+ * égalité > préfixe > sous-chaîne > sous-séquence, puis nom le plus court,
+ * puis ordre d'origine. `query` vide → aucun résultat.
+ */
+export function rankSuggestions<T extends { name: string }>(
+  items: T[],
+  query: string,
+  limit = 8,
+): T[] {
+  const q = query.trim().toLowerCase()
+  if (!q) return []
+  return items
+    .map((item, index) => {
+      const name = item.name.toLowerCase()
+      const score = name === q
+        ? 0
+        : name.startsWith(q)
+          ? 1
+          : name.includes(q)
+            ? 2
+            : isSubsequence(q, name)
+              ? 3
+              : -1
+      return { item, index, score, length: name.length }
+    })
+    .filter((entry) => entry.score >= 0)
+    .sort((a, b) => a.score - b.score || a.length - b.length || a.index - b.index)
+    .slice(0, limit)
+    .map((entry) => entry.item)
+}
+
+/** Arguments d'une signature (`"range, criteria, [sum_range]"` → 3 entrées). */
+export function signatureArgs(sig: string): string[] {
+  return sig
+    .split(",")
+    .map((part) => part.trim())
+    .filter(Boolean)
+}
+
+export interface FunctionCallAtResult {
+  /** Nom de la fonction (minuscules) */
+  name: string
+  /** Index de l'argument courant (0-based) */
+  index: number
+}
+
+/**
+ * Fonction (parmi `known`) dans les parenthèses de laquelle se trouve le curseur.
+ * Gère l'imbrication, les littéraux et les virgules de chaque niveau.
+ */
+export function functionCallAt(
+  text: string,
+  caret: number,
+  known: Iterable<string>,
+): FunctionCallAtResult | null {
+  const names = new Set([...known].map((name) => name.toLowerCase()))
+  const end = Math.max(0, Math.min(caret, text.length))
+  const stack: { name: string; index: number }[] = []
+  let quote = ""
+  for (let i = 0; i < end; i++) {
+    const ch = text[i]!
+    if (quote) {
+      if (ch === quote) {
+        if (text[i + 1] === quote) {
+          i++
+          continue
+        }
+        quote = ""
+      }
+      continue
+    }
+    if (ch === '"' || ch === "'") {
+      quote = ch
+      continue
+    }
+    if (ch === "(") {
+      let j = i - 1
+      while (j >= 0 && /[A-Za-z0-9_]/.test(text[j]!)) j--
+      stack.push({ name: text.slice(j + 1, i).toLowerCase(), index: 0 })
+      continue
+    }
+    if (ch === ")") {
+      stack.pop()
+      continue
+    }
+    if (ch === "," && stack.length) stack[stack.length - 1]!.index++
+  }
+  for (let k = stack.length - 1; k >= 0; k--) {
+    const frame = stack[k]!
+    if (names.has(frame.name)) return { name: frame.name, index: frame.index }
+  }
+  return null
+}
+
+/** Segments d'une formule : `code: false` = littéral de chaîne (guillemets simples/doubles). */
+const splitFormulaSegments = (src: string): { code: boolean; text: string }[] => {
+  const out: { code: boolean; text: string }[] = []
+  let code = ""
+  let i = 0
+  while (i < src.length) {
+    const ch = src[i]!
+    if (ch !== '"' && ch !== "'") {
+      code += ch
+      i++
+      continue
+    }
+    if (code) {
+      out.push({ code: true, text: code })
+      code = ""
+    }
+    let literal = ch
+    i++
+    while (i < src.length) {
+      const c = src[i]!
+      literal += c
+      i++
+      if (c !== ch) continue
+      // Guillemet doublé = caractère littéral (cf. parseString du moteur)
+      if (src[i] === ch) {
+        literal += src[i]
+        i++
+        continue
+      }
+      break
+    }
+    out.push({ code: false, text: literal })
+  }
+  if (code) out.push({ code: true, text: code })
+  return out
+}
+
+/** Décalage des références dans un segment de code (jamais dans une chaîne). */
+const shiftCodeRefs = (code: string, dr: number, dc: number): string =>
+  code.replace(
     /(\$?)([A-Za-z]{1,3})(\$?)(\d+)/g,
-    (_m: string, ca: string, L: string, ra: string, D: string) => {
-      const col = colFromLetters(L) + (ca === "$" ? 0 : dc)
-      const row = Number(D) - 1 + (ra === "$" ? 0 : dr)
-      if (col < 0 || row < 0) return _m
+    (match: string, ca: string, letters: string, ra: string, digits: string, offset: number) => {
+      // Borne gauche : la ref doit commencer un token (pas « LOG10 », « price1 »…)
+      const before = offset > 0 ? code[offset - 1]! : ""
+      if (before && /[A-Za-z0-9_.]/.test(before)) return match
+      // Borne droite : pas de suite alphanumérique, pas un appel de fonction
+      const after = code[offset + match.length] ?? ""
+      if (after && /[A-Za-z0-9_(]/.test(after)) return match
+      const col = colFromLetters(letters) + (ca === "$" ? 0 : dc)
+      const row = Number(digits) - 1 + (ra === "$" ? 0 : dr)
+      if (col < 0 || row < 0) return match
       return ca + colLetter(col) + ra + (row + 1)
     },
   )

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dnax/ui",
-  "version": "0.0.66",
+  "version": "0.0.69",
   "module": "index.ts",
   "description": "UI design System",
   "type": "module",

package/styles/main.css

@@ -9934,6 +9934,67 @@ a.q-breadcrumbs__el:hover {
   opacity: 0.55;
 }
 
+/* Aperçu live du résultat (barre fx) — discret, monospace, rouge si erreur */
+.q-spreadsheet__fx-preview {
+  flex: 0 1 auto;
+  min-width: 0;
+  max-width: 40%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  padding-left: 8px;
+  border-left: 1px solid var(--q-spreadsheet-border);
+  color: var(--muted-foreground, rgb(0 0 0 / 0.6));
+  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
+  font-size: 12px;
+}
+.q-spreadsheet__fx-preview-eq {
+  margin-right: 4px;
+  opacity: 0.6;
+}
+.q-spreadsheet__fx-preview--error {
+  color: var(--negative, #c10015);
+  font-weight: 600;
+}
+.dark .q-spreadsheet__fx-preview,
+.q-spreadsheet--dark .q-spreadsheet__fx-preview {
+  color: rgb(255 255 255 / 0.6);
+}
+
+/* Aide à l'argument : signature de la fonction au curseur */
+.q-spreadsheet__fxhint {
+  flex: 0 1 auto;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: var(--muted-foreground, rgb(0 0 0 / 0.6));
+  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
+  font-size: 12px;
+}
+.q-spreadsheet__fxhint strong {
+  color: var(--foreground, #1d1d1d);
+}
+.q-spreadsheet__fxhint-arg--on {
+  color: var(--primary, #1976d2);
+  font-weight: 700;
+}
+/* Dans l'éditeur de cellule : sous le textarea, séparateur discret */
+.q-spreadsheet__fxhint--editor {
+  flex: 0 0 auto;
+  padding: 3px 8px 5px;
+  border-top: 1px dashed var(--q-spreadsheet-border);
+  white-space: normal;
+}
+.dark .q-spreadsheet__fxhint,
+.q-spreadsheet--dark .q-spreadsheet__fxhint {
+  color: rgb(255 255 255 / 0.6);
+}
+.dark .q-spreadsheet__fxhint strong,
+.q-spreadsheet--dark .q-spreadsheet__fxhint strong {
+  color: #fff;
+}
+
 /* ─── Éditeur formule (textarea monospace) ─── */
 .q-spreadsheet__editor--formula {
   align-items: stretch;
@@ -10324,6 +10385,10 @@ a.q-breadcrumbs__el:hover {
   color: #8b93a1;
   font-size: 11.5px;
 }
+.q-spreadsheet__fnsug-kind {
+  font-style: italic;
+  opacity: 0.85;
+}
 .q-spreadsheet__fnsug-item:hover,
 .q-spreadsheet__fnsug-item--on {
   background: rgb(25 118 210 / 0.1);