@sia-ui/cli 0.4.0 → 0.6.0

package/dist/registry/package/lib/form-adapter-rhf.tsx

@@ -22,11 +22,21 @@ import {
   type UseFormProps,
   type UseFormReturn,
 } from "react-hook-form";
-import type { FieldBindOptions, FieldBinding, FormAdapter, FormErrors, FormState } from "@sia-ui/headless";
+import {
+  hasFormErrors,
+  type FieldBindOptions,
+  type FieldBinding,
+  type FormAdapter,
+  type FormErrors,
+  type FormState,
+  type FormSubmitResult,
+} from "@sia-ui/headless";
 
 export interface RhfAdapterOptions<TValues extends FieldValues>
   extends UseFormProps<TValues> {
-  onSubmit?: (values: TValues) => void | Promise<void>;
+  onSubmit?: (
+    values: TValues,
+  ) => FormSubmitResult<TValues> | Promise<FormSubmitResult<TValues>>;
 }
 
 export interface RhfAdapter<TValues extends FieldValues>
@@ -94,6 +104,12 @@ export function useRhfFormAdapter<TValues extends FieldValues>(
     [formOptions.mode, formState.errors, setValue, trigger, watch],
   );
 
+  const poserErreurs = (next: FormErrors<TValues>) => {
+    for (const [key, message] of Object.entries(next)) {
+      if (message) setError(key as Path<TValues>, { message: String(message) });
+    }
+  };
+
   const state: FormState<TValues> = {
     values: values as TValues,
     errors,
@@ -123,17 +139,14 @@ export function useRhfFormAdapter<TValues extends FieldValues>(
       if (message) setError(name as Path<TValues>, { message });
       else clearErrors(name as Path<TValues>);
     },
-    // Ce que rend `HttpError.fields` de `@sia-ui/api` entre directement ici :
-    // les erreurs du serveur se posent sous les champs, pas dans un bandeau.
-    setErrors: (next) => {
-      for (const [key, message] of Object.entries(next)) {
-        if (message) setError(key as Path<TValues>, { message: String(message) });
-      }
-    },
+    // Ce que rend `HttpError.toFormErrors()` de `@sia-ui/api` entre directement
+    // ici : les erreurs du serveur se posent sous les champs, pas dans un bandeau.
+    setErrors: poserErreurs,
     reset: (next) => reset(next as TValues | undefined),
     submit: async () => {
       await handleSubmit(async (formValues) => {
-        await onSubmit?.(formValues);
+        const result = await onSubmit?.(formValues);
+        if (hasFormErrors(result)) poserErreurs(result);
       })();
     },
     validate: () => trigger(),

package/dist/registry/registry.json

@@ -22,6 +22,32 @@
         "icons"
       ]
     },
+    {
+      "name": "activity-log",
+      "description": "Server-filtered activity log: declared filters, debounced search, pagination and page size.",
+      "type": "pattern",
+      "version": "0.3.0",
+      "status": "experimental",
+      "source": "package",
+      "files": [
+        "components/ActivityLog/index.tsx",
+        "components/ActivityLog/styles.css"
+      ],
+      "dependencies": [
+        "@sia-ui/headless",
+        "@sia-ui/tokens",
+        "@sia-ui/utils"
+      ],
+      "registryDependencies": [
+        "badge",
+        "data-table",
+        "filters-bar",
+        "page-header",
+        "pagination",
+        "search-input",
+        "select"
+      ]
+    },
     {
       "name": "alert",
       "description": "Semantic feedback alert with tones, action and dismissal.",
@@ -179,7 +205,7 @@
       "name": "badge",
       "description": "Compact semantic status label with side content and loading state.",
       "type": "primitive",
-      "version": "0.1.0",
+      "version": "0.3.0",
       "status": "stable",
       "source": "package",
       "files": [
@@ -240,7 +266,7 @@
       "name": "calendar",
       "description": "Localized month and year calendar with range selection and custom cells.",
       "type": "component",
-      "version": "0.1.0",
+      "version": "0.1.1",
       "status": "stable",
       "source": "package",
       "files": [
@@ -383,7 +409,7 @@
       "name": "crud-page",
       "description": "List page for a declared resource: create, view, edit and delete open their own dialogs, each removable and permission-aware.",
       "type": "pattern",
-      "version": "0.2.0",
+      "version": "0.4.0",
       "status": "stable",
       "source": "package",
       "files": [
@@ -426,7 +452,7 @@
       "name": "data-table",
       "description": "Data table: row actions with permissions and confirmation, selection, card view, density and sorting.",
       "type": "component",
-      "version": "0.2.0",
+      "version": "0.4.0",
       "status": "stable",
       "source": "package",
       "files": [
@@ -566,17 +592,21 @@
       "name": "drawer",
       "description": "Accessible side panel with focus management and portal rendering.",
       "type": "component",
-      "version": "0.1.0",
+      "version": "0.1.1",
       "status": "stable",
       "source": "package",
       "files": [
         "components/Drawer/index.tsx",
+        "components/Drawer/context.ts",
         "components/Drawer/styles.css"
       ],
       "dependencies": [
         "@sia-ui/headless",
         "@sia-ui/react",
         "@sia-ui/utils"
+      ],
+      "registryDependencies": [
+        "icons"
       ]
     },
     {
@@ -755,7 +785,7 @@
       "name": "form",
       "description": "Declarative form driven by a field list, wired to any FormAdapter.",
       "type": "pattern",
-      "version": "0.1.0",
+      "version": "0.3.0",
       "status": "stable",
       "source": "package",
       "files": [
@@ -767,6 +797,7 @@
         "@sia-ui/utils"
       ],
       "registryDependencies": [
+        "alert",
         "button",
         "field"
       ]
@@ -775,7 +806,7 @@
       "name": "form-adapter-rhf",
       "description": "react-hook-form adapter for the FormAdapter contract. Requires react-hook-form.",
       "type": "primitive",
-      "version": "0.1.0",
+      "version": "0.3.0",
       "status": "stable",
       "source": "package",
       "files": [
@@ -841,7 +872,7 @@
       "name": "icons",
       "description": "Jeu d'icônes SVG sans dépendance, servi par le package.",
       "type": "primitive",
-      "version": "0.1.0",
+      "version": "0.3.0",
       "status": "stable",
       "source": "package",
       "files": [
@@ -1075,7 +1106,7 @@
       "name": "page-header",
       "description": "Consistent page title, description and action area.",
       "type": "pattern",
-      "version": "0.1.0",
+      "version": "0.3.0",
       "status": "stable",
       "source": "package",
       "files": [
@@ -1090,7 +1121,7 @@
       "name": "pagination",
       "description": "Accessible controlled pagination with compact page ranges.",
       "type": "component",
-      "version": "0.1.0",
+      "version": "0.3.0",
       "status": "stable",
       "source": "package",
       "files": [
@@ -1102,7 +1133,8 @@
         "@sia-ui/utils"
       ],
       "registryDependencies": [
-        "icons"
+        "icons",
+        "select"
       ]
     },
     {
@@ -1140,7 +1172,7 @@
       "name": "phone-input",
       "description": "International phone input with dial code and grouping.",
       "type": "component",
-      "version": "0.1.0",
+      "version": "0.3.0",
       "status": "stable",
       "source": "package",
       "files": [
@@ -1152,7 +1184,8 @@
         "@sia-ui/utils"
       ],
       "registryDependencies": [
-        "input"
+        "input",
+        "select"
       ]
     },
     {
@@ -1309,7 +1342,7 @@
       "name": "resource",
       "description": "Declare a resource once: table columns, form fields, detail view, validation, search keys and permissions are all derived from it.",
       "type": "pattern",
-      "version": "0.2.0",
+      "version": "0.3.0",
       "status": "stable",
       "source": "package",
       "files": [
@@ -1378,11 +1411,33 @@
         "icons"
       ]
     },
+    {
+      "name": "secret-fields",
+      "description": "Write-only key/value secrets editor: stored names shown, values never read back.",
+      "type": "component",
+      "version": "0.3.0",
+      "status": "experimental",
+      "source": "package",
+      "files": [
+        "components/SecretFields/index.tsx",
+        "components/SecretFields/styles.css"
+      ],
+      "dependencies": [
+        "@sia-ui/utils"
+      ],
+      "registryDependencies": [
+        "button",
+        "icon-button",
+        "icons",
+        "input",
+        "password-input"
+      ]
+    },
     {
       "name": "select",
       "description": "Accessible searchable select with positioned overlay and async option loading.",
       "type": "component",
-      "version": "0.1.0",
+      "version": "0.3.0",
       "status": "stable",
       "source": "package",
       "files": [
@@ -1647,7 +1702,7 @@
       "name": "timer",
       "description": "Reliable count-up or count-down timer based on absolute time.",
       "type": "component",
-      "version": "0.1.0",
+      "version": "0.1.1",
       "status": "stable",
       "source": "package",
       "files": [

package/dist/registry/styles/sia-ui.css

@@ -144,6 +144,12 @@
   --sia-elevation-modal: 0 24px 60px rgb(15 23 42 / 0.22);
 }
 /* @end:theme */
+/* Les composants sont écrits en `border-box` : `width:100%` plus un padding
+   ne doit pas déborder. Sans ce reset, un projet qui n'en pose pas lui-même
+   gagnait 32 px de défilement horizontal sous `AppShell`, et des champs plus
+   larges que leur colonne. Spécificité nulle : la moindre règle de l'hôte
+   l'emporte, et un composant qui veut `content-box` le déclare (Chart). */
+:where(*), :where(*)::before, :where(*)::after { box-sizing:border-box; }
 /* Scrollbars SIA UI globales : faibles en spécificité, donc surchargeables. */
 :root {
   --sia-scrollbar-size:.625rem;
@@ -203,7 +209,7 @@
 /* Wave 2 business components */
 @media (max-width:900px) { .sia-kpi-grid--3,.sia-kpi-grid--4 { grid-template-columns:repeat(2,minmax(0,1fr)); } }
 @media (max-width:560px) { .sia-kpi-grid--2,.sia-kpi-grid--3,.sia-kpi-grid--4 { grid-template-columns:1fr; } .sia-filters-bar { align-items:stretch; }.sia-filters-bar__main,.sia-filters-bar__actions { width:100%; } }
-@media (max-width:640px) { .sia-page-header { flex-direction:column; } .sia-page-header__actions { width:100%; } .sia-entity-meta__grid { grid-template-columns:1fr; } }
+@media (max-width:640px) { .sia-entity-meta__grid { grid-template-columns:1fr; } }
 .sia-month-picker,.sia-year-picker,.sia-week-picker { min-height:2.5rem; padding:0 .75rem; border:1px solid var(--sia-border); border-radius:var(--sia-radius); color:var(--sia-foreground); background:var(--sia-background); font:inherit; }
 .sia-picker--invalid { border-color:var(--sia-danger); }
 .sia-tone--neutral { --sia-accent:var(--sia-muted); --sia-accent-foreground:var(--sia-background); }

package/dist/source.mjs

@@ -40,6 +40,7 @@ export async function sourceLocale(racine) {
     origine: "embarqué",
     registre,
     lire: (fichier) => readFile(join(racine, "package", fichier)),
+    lireStyles: () => readFile(join(racine, "styles/sia-ui.css")),
   };
 }
 
@@ -78,6 +79,15 @@ export async function sourceDistante(base) {
       }
       return Buffer.from(await r.arrayBuffer());
     },
+    // La feuille vient du même registre que les composants : servis par une
+    // URL, ils ne doivent pas dépendre de la feuille figée dans la CLI.
+    lireStyles: async () => {
+      const r = await fetch(new URL("styles/sia-ui.css", racine));
+      if (!r.ok) {
+        throw new Error(`styles/sia-ui.css a répondu ${r.status} sur ${racine}`);
+      }
+      return Buffer.from(await r.arrayBuffer());
+    },
   };
 }
 

package/dist/styles.mjs

@@ -0,0 +1,111 @@
+import { mkdir, readFile, writeFile } from "node:fs/promises";
+import { dirname, join } from "node:path";
+import { empreinte } from "./lock.mjs";
+
+/**
+ * La feuille commune, suivie comme un composant.
+ *
+ * Copiée une fois par `init`, puis plus rien ne la touchait : les composants
+ * se mettaient à jour sans elle. Or un composant peut dépendre d'une règle
+ * nouvelle de la feuille — le reset `box-sizing` en est un — et
+ * l'utilisateur recevait le composant sans ce qui le fait tenir.
+ *
+ * Son empreinte à la copie est notée dans le verrou (`styles`). Non
+ * retouchée, elle suit le registre ; retouchée, elle n'est remplacée que sur
+ * demande (`update --force`). Elle est lue à la même source que les
+ * composants : copie embarquée ou registre HTTP.
+ */
+
+async function lire(chemin) {
+  try {
+    return await readFile(chemin);
+  } catch (error) {
+    if (error.code === "ENOENT") return null;
+    throw error;
+  }
+}
+
+/**
+ * L'état de la feuille du projet.
+ *
+ * `absente`, `à jour`, `en retard` (non retouchée, le registre a plus
+ * récent), `modifiée` (retouchée depuis la copie), ou `non suivie` (copiée
+ * par une CLI qui ne notait pas son empreinte, et différente de l'actuelle).
+ */
+export async function etatStyles({ cwd, config, lock, lireStyles }) {
+  const cible = join(cwd, config.styles);
+  const contenu = await lireStyles();
+  const actuelle = { contenu, empreinte: empreinte(contenu) };
+  const presente = await lire(cible);
+
+  if (presente === null) return { etat: "absente", cible, actuelle };
+
+  const locale = empreinte(presente);
+  if (locale === actuelle.empreinte) return { etat: "à jour", cible, actuelle };
+
+  const notee = lock.styles?.hash;
+  if (!notee) return { etat: "non suivie", cible, actuelle };
+  return {
+    etat: locale === notee ? "en retard" : "modifiée",
+    cible,
+    actuelle,
+  };
+}
+
+const RAISON = {
+  modifiée: "modifiée localement",
+  "non suivie": "copiée avant le suivi des versions",
+};
+
+/**
+ * Met la feuille à jour selon ce que la commande autorise, et le dit.
+ *
+ * - `creer` — `init` : seulement si elle est absente.
+ * - `sur` — `add` : absente ou en retard ; jamais une feuille retouchée.
+ * - `forcer` — `update --force` : même retouchée.
+ *
+ * Complète le verrou (`styles`) sans l'écrire : l'appelant l'écrit une fois,
+ * avec le reste. `dryRun` annonce sans rien toucher.
+ */
+export async function synchroniserStyles(
+  { cwd, config, lock, lireStyles },
+  { mode = "sur", dryRun = false } = {},
+) {
+  const { etat, cible, actuelle } = await etatStyles({
+    cwd,
+    config,
+    lock,
+    lireStyles,
+  });
+
+  const noter = () => {
+    if (!dryRun) lock.styles = { file: config.styles, hash: actuelle.empreinte };
+  };
+
+  if (etat === "à jour") {
+    noter();
+    return { etat, action: "rien" };
+  }
+
+  const ecrire =
+    etat === "absente" ||
+    (mode !== "creer" && etat === "en retard") ||
+    mode === "forcer";
+
+  if (ecrire) {
+    if (!dryRun) {
+      await mkdir(dirname(cible), { recursive: true });
+      await writeFile(cible, actuelle.contenu);
+    }
+    noter();
+    console.log(`${etat === "absente" ? "add   " : "update"} ${config.styles}`);
+    return { etat, action: "écrite" };
+  }
+
+  console.log(
+    mode === "creer"
+      ? `skip   ${config.styles} (déjà présente — sia-ui update pour la mettre à jour)`
+      : `keep   ${config.styles} (${RAISON[etat]} — sia-ui update --force pour la remplacer)`,
+  );
+  return { etat, action: "gardée" };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sia-ui/cli",
-  "version": "0.4.0",
+  "version": "0.6.0",
   "description": "Install SIA UI components progressively into an application.",
   "keywords": [
     "sia-ui",
@@ -39,10 +39,10 @@
     "react-dom": "^19.2.3",
     "typescript": "^5.9.3",
     "vitest": "^4.0.16",
-    "@sia-ui/headless": "0.4.0",
-    "@sia-ui/utils": "0.4.0",
-    "@sia-ui/tokens": "0.4.0",
-    "@sia-ui/react": "0.4.0"
+    "@sia-ui/headless": "0.6.0",
+    "@sia-ui/react": "0.6.0",
+    "@sia-ui/utils": "0.6.0",
+    "@sia-ui/tokens": "0.6.0"
   },
   "scripts": {
     "build": "node scripts/build.mjs",