kommon-lab

Ce repo est le code source du design system Kommon Lab — une déclinaison du design system Kommon Kiabi, buildée et automatisée avec l'IA, conçue pour être nativement consommée par des agents IA.

L'objectif : permettre à n'importe qui — dev, designer, PO ou agent IA — de vibe-coder des interfaces conformes aux 5 marques Kiabi sans accès au design system officiel.

Ce repo produit le paquet npm kommon-lab.

→ Documentation : https://kommon-lab.vercel.app

Architecture

De Figma au paquet npm, en passant par un pipeline de build automatisé :

figma-exports/  →  tokens/*.json  →  dist/css/  →  npm publish

| Dossier | Contenu | |---|---| | tokens/ | Fichiers JSON de design tokens — source de vérité, 5 marques | | components/ | Composants UI HTML/CSS | | dist/css/ | CSS généré au build — ne pas modifier manuellement | | docs/ | Guidelines embarquées dans le paquet, lues par les agents IA | | scripts/ | Pipeline de build (transform, tokens, index composants, postinstall) | | skills/ | Prompts de workflow pour agents IA — non distribués dans le paquet |

Paquet npm

npm install kommon-lab

À l'installation, un script configure automatiquement ton agent IA — Claude Code, Gemini CLI, Lovable, Cursor, GitHub Copilot. Tu vibe-codes, il applique.

Ce que tu obtiens :

• Tokens CSS — Couleurs, typographie, espacement, bordures
• Composants — Bibliothèque CSS-only prête à l'emploi
• Icônes — +100 icônes SVG
• Multi-brand — Kiabi · Beebs · Kitchoun · Ekstract · Kiabi Home — un seul swap CSS pour changer de marque
• Guidelines — Embarquées, injectées dans l'agent à l'installation

Documentation

| Fichier | Contenu | |---|---| | docs/agent-setup.md | Point d'entrée — inventaire du paquet, interdépendances, arbre de décision | | docs/tokens-guidelines.md | Tokens, typographie, couleurs, espacement | | docs/components-guidelines.md | Composants disponibles, règles, checklist | | docs/icons-guidelines.md | Icônes, liste complète, règles d'usage | | components/*/README.md | API et exemples par composant |

Versioning

Ce package suit le Semantic Versioning. Actuellement en 0.x.x.

| Type | Quand | |---|---| | PATCH | Correction de bug, aucun token renommé | | MINOR | Nouveaux tokens, marques ou composants ajoutés | | MAJOR | Token renommé ou supprimé — vérifier avant de mettre à jour |