origam 2.33.0 → 2.35.0

package/CHANGELOG.md

@@ -18,6 +18,22 @@ This project follows [Semantic Versioning](https://semver.org).
 
 ## [Unreleased]
 
+## [2.35.0] - 2026-10-19
+
+### Added — `OrigamCode` : `lang` ouvert, `createOrigam({ code: { langs } })` (#1180)
+
+- `lang` n'est plus limité aux 14 grammaires de `SUPPORTED_LANGS` quand un `code.highlighter` est fourni : la valeur est transmise telle quelle au highlighter, qui sait seul ce qu'il peut servir. S'il échoue, le bloc retombe sur `plaintext` (le `try/catch` existant autour de `codeToHtml`), avec un avertissement dev-only, une fois par langage. Avant, `resolveLang()` repliait tout `lang` inconnu sur `plaintext` avant de consulter le highlighter, donc `dockerfile` ne pouvait jamais être servi.
+- Nouvelle option `createOrigam({ code: { langs } })` : liste passée à `createHighlighter` (défaut : `SUPPORTED_LANGS`). Avec le highlighter intégré, un `lang` présent dans `langs` est accepté.
+- Typage : la prop `lang` devient `TCodeLangOpen` (`TCodeLang | (string & {})`), l'autocomplétion des 14 valeurs est conservée. `TCodeLang` reste la liste fermée.
+
+## [2.34.0] - 2026-10-19
+
+### Added — `OrigamCommandPalette` : prop `filter` pour afficher des résultats classés en externe (#1184)
+
+- Nouvelle prop `filter` : `true` (défaut, comportement inchangé : correspondance floue intégrée et tri par score), `false` (les `commands` sont affichées telles quelles, dans l'ordre fourni) ou une fonction `(commands, query) => commands` dont le résultat est affiché dans son ordre.
+- Destinée à la recherche serveur ou plein texte alimentée par l'événement `query` : un résultat trouvé dans le corps d'un document n'est plus masqué parce que la requête n'est pas une sous-séquence de son libellé, et le classement du moteur est conservé.
+- Avec `filter=false` ou une fonction, une liste `commands` vide reste vide : elle ne retombe plus sur le registre `useCommand()` (le repli est conservé avec `filter=true`).
+
 ## [2.33.0] - 2026-10-18
 
 ### Added — `OrigamCommandPalette` : icônes de recherche et de chargement personnalisables (#1183)

package/dist/src/components/CommandPalette/OrigamCommandPalette.vue

@@ -191,6 +191,7 @@ const props = defineProps({
   modelValue: { type: Boolean, required: false, default: false },
   hotkey: { type: [Array, null], required: false, default: () => COMMAND_PALETTE_DEFAULT_HOTKEY },
   commands: { type: Array, required: false },
+  filter: { type: [Boolean, Function], required: false, default: true },
   placeholder: { type: String, required: false, default: "origam.command_palette.placeholder" },
   emptyText: { type: String, required: false, default: "origam.command_palette.empty_text" },
   maxHeight: { type: [Number, String], required: false, default: COMMAND_PALETTE_DEFAULT_MAX_HEIGHT },
@@ -260,11 +261,17 @@ if (IN_BROWSER) {
   }, { immediate: true });
 }
 const sourceCommands = computed(() => {
-  if (props.commands && props.commands.length > 0) return props.commands;
+  if (props.commands && (props.commands.length > 0 || props.filter !== true)) return props.commands;
   return registryCommands.value;
 });
 const query = ref("");
 const filtered = computed(() => {
+  if (typeof props.filter === "function") {
+    return props.filter(sourceCommands.value, query.value).map((item) => ({ item, score: 0 }));
+  }
+  if (props.filter === false) {
+    return sourceCommands.value.map((item) => ({ item, score: 0 }));
+  }
   return fuzzyMatch(sourceCommands.value, query.value, (cmd) => ({
     label: cmd.label,
     haystack: [

package/dist/src/composables/Code/code.composable.cjs

@@ -34,14 +34,14 @@ function lruSet(key, value) {
   }
   _cache.set(key, value);
 }
-async function loadHighlighter(loader) {
+async function loadHighlighter(loader, langs) {
   if (_highlighterUnavailable) return null;
   if (_highlighterPromise) return _highlighterPromise;
   _highlighterPromise = (async () => {
     const shiki = loader ? await loader() : await Promise.resolve().then(() => require("shiki"));
     const highlighter = await shiki.createHighlighter({
       themes: [_code.CODE_LIGHT_THEME, _code.CODE_DARK_THEME],
-      langs: [..._code.SUPPORTED_LANGS]
+      langs: [...(langs ?? _code.SUPPORTED_LANGS)]
     });
     _highlighterReady = true;
     return highlighter;
@@ -56,22 +56,26 @@ async function loadHighlighter(loader) {
     return null;
   });
 }
-function resolveLang(lang) {
+function resolveLang(lang, hasCustomHighlighter, extraLangs) {
+  if (hasCustomHighlighter) return lang;
   if (_code.SUPPORTED_LANGS.includes(lang)) return lang;
+  if (extraLangs?.includes(lang)) return lang;
   if (!_unsupportedLangWarned.has(lang)) {
     _unsupportedLangWarned.add(lang);
-    console.warn(`[origam] OrigamCode: lang="${lang}" is not in the bundled grammar set. Falling back to "${_enums.CODE_LANG.PLAINTEXT}". Supported: ${_code.SUPPORTED_LANGS.join(", ")}.`);
+    console.warn(`[origam] OrigamCode: lang="${lang}" is not in the bundled grammar set. Falling back to "${_enums.CODE_LANG.PLAINTEXT}". Supported: ${[..._code.SUPPORTED_LANGS, ...(extraLangs ?? [])].join(", ")}. Add it with createOrigam({ code: { langs } }) or supply a code.highlighter.`);
   }
   return _enums.CODE_LANG.PLAINTEXT;
 }
 function useCode() {
-  const highlighterLoader = (0, _vue.inject)(_code.ORIGAM_CODE_KEY)?.highlighter;
+  const codeOptions = (0, _vue.inject)(_code.ORIGAM_CODE_KEY);
+  const highlighterLoader = codeOptions?.highlighter;
+  const customLangs = codeOptions?.langs;
   async function highlight(code, lang) {
-    const resolvedLang = resolveLang(lang);
+    const resolvedLang = resolveLang(lang, highlighterLoader !== void 0, customLangs);
     const key = makeCacheKey(code, resolvedLang);
     const cached = lruGet(key);
     if (cached !== void 0) return cached;
-    const highlighter = await loadHighlighter(highlighterLoader);
+    const highlighter = await loadHighlighter(highlighterLoader, customLangs);
     if (!highlighter) {
       const plain = escapeHtml(code);
       lruSet(key, plain);
@@ -89,7 +93,10 @@ function useCode() {
     try {
       html = highlighter.codeToHtml(code, opts);
     } catch (err) {
-      console.warn("[origam] OrigamCode: shiki failed to tokenise, falling back to plaintext.", err);
+      if (process.env?.DEV && !_unsupportedLangWarned.has(resolvedLang)) {
+        _unsupportedLangWarned.add(resolvedLang);
+        console.warn(`[origam] OrigamCode: shiki could not tokenise lang="${resolvedLang}", falling back to plaintext.`, err);
+      }
       html = highlighter.codeToHtml(code, {
         ...opts,
         lang: _enums.CODE_LANG.PLAINTEXT
@@ -99,7 +106,7 @@ function useCode() {
     return html;
   }
   async function prime() {
-    await loadHighlighter(highlighterLoader);
+    await loadHighlighter(highlighterLoader, customLangs);
   }
   function isReady() {
     return _highlighterReady;

package/dist/src/composables/Code/code.composable.js

@@ -27,7 +27,7 @@ function lruSet(key, value) {
   }
   _cache.set(key, value);
 }
-async function loadHighlighter(loader) {
+async function loadHighlighter(loader, langs) {
   if (_highlighterUnavailable) return null;
   if (_highlighterPromise) return _highlighterPromise;
   _highlighterPromise = (async () => {
@@ -37,7 +37,7 @@ async function loadHighlighter(loader) {
     );
     const highlighter = await shiki.createHighlighter({
       themes: [LIGHT_THEME, DARK_THEME],
-      langs: [...SUPPORTED_LANGS]
+      langs: [...langs ?? SUPPORTED_LANGS]
     });
     _highlighterReady = true;
     return highlighter;
@@ -55,24 +55,28 @@ async function loadHighlighter(loader) {
     return null;
   });
 }
-function resolveLang(lang) {
+function resolveLang(lang, hasCustomHighlighter, extraLangs) {
+  if (hasCustomHighlighter) return lang;
   if (SUPPORTED_LANGS.includes(lang)) return lang;
+  if (extraLangs?.includes(lang)) return lang;
   if (!_unsupportedLangWarned.has(lang)) {
     _unsupportedLangWarned.add(lang);
     console.warn(
-      `[origam] OrigamCode: lang="${lang}" is not in the bundled grammar set. Falling back to "${CODE_LANG.PLAINTEXT}". Supported: ${SUPPORTED_LANGS.join(", ")}.`
+      `[origam] OrigamCode: lang="${lang}" is not in the bundled grammar set. Falling back to "${CODE_LANG.PLAINTEXT}". Supported: ${[...SUPPORTED_LANGS, ...extraLangs ?? []].join(", ")}. Add it with createOrigam({ code: { langs } }) or supply a code.highlighter.`
     );
   }
   return CODE_LANG.PLAINTEXT;
 }
 export function useCode() {
-  const highlighterLoader = inject(ORIGAM_CODE_KEY)?.highlighter;
+  const codeOptions = inject(ORIGAM_CODE_KEY);
+  const highlighterLoader = codeOptions?.highlighter;
+  const customLangs = codeOptions?.langs;
   async function highlight(code, lang) {
-    const resolvedLang = resolveLang(lang);
+    const resolvedLang = resolveLang(lang, highlighterLoader !== void 0, customLangs);
     const key = makeCacheKey(code, resolvedLang);
     const cached = lruGet(key);
     if (cached !== void 0) return cached;
-    const highlighter = await loadHighlighter(highlighterLoader);
+    const highlighter = await loadHighlighter(highlighterLoader, customLangs);
     if (!highlighter) {
       const plain = escapeHtml(code);
       lruSet(key, plain);
@@ -87,14 +91,17 @@ export function useCode() {
     try {
       html = highlighter.codeToHtml(code, opts);
     } catch (err) {
-      console.warn("[origam] OrigamCode: shiki failed to tokenise, falling back to plaintext.", err);
+      if (import.meta.env?.DEV && !_unsupportedLangWarned.has(resolvedLang)) {
+        _unsupportedLangWarned.add(resolvedLang);
+        console.warn(`[origam] OrigamCode: shiki could not tokenise lang="${resolvedLang}", falling back to plaintext.`, err);
+      }
       html = highlighter.codeToHtml(code, { ...opts, lang: CODE_LANG.PLAINTEXT });
     }
     lruSet(key, html);
     return html;
   }
   async function prime() {
-    await loadHighlighter(highlighterLoader);
+    await loadHighlighter(highlighterLoader, customLangs);
   }
   function isReady() {
     return _highlighterReady;

package/dist/src/interfaces/Code/code.interface.d.ts

@@ -7,7 +7,7 @@ import type { IMarginProps } from '../Commons/margin.interface';
 import type { IPaddingProps } from '../Commons/padding.interface';
 import type { IRoundedProps } from '../Commons/rounded.interface';
 import type { ITypographyProps } from '../Commons/typography.interface';
-import type { TCodeLang, TShikiHighlighterLoader } from '../../types/Code/code.type';
+import type { TCodeLangOpen, TShikiHighlighterLoader } from '../../types/Code/code.type';
 /**
  * Props for `<OrigamCode>` — a shiki-powered code block with line numbers,
  * line highlighting, copy button and theme awareness.
@@ -26,11 +26,15 @@ export interface ICodeProps extends ICommonsComponentProps, ITagProps, IBorderPr
      */
     code?: string;
     /**
-     * Language grammar to apply. One of the values in `SUPPORTED_LANGS`.
-     * Unknown values fall back to `plaintext` (with a one-shot console
-     * warning).
+     * Language grammar to apply. Autocompletes the 14 values of
+     * `SUPPORTED_LANGS` but accepts any string (#1180). Without a custom
+     * `code.highlighter`, a value outside `SUPPORTED_LANGS` and outside
+     * `createOrigam({ code: { langs } })` falls back to `plaintext` (one-shot
+     * console warning). With a custom `code.highlighter`, the value is handed
+     * to it as-is; if it cannot tokenise it, the block falls back to
+     * `plaintext` (dev-only warning).
      */
-    lang?: TCodeLang;
+    lang?: TCodeLangOpen;
     /**
      * Show a left gutter with line numbers. Pure CSS — uses a CSS counter
      * incremented per `.origam-code__row`, no JS layout work.
@@ -90,7 +94,7 @@ export interface ICodeProps extends ICommonsComponentProps, ITagProps, IBorderPr
  *
  * @description
  * App-level config for `<OrigamCode>`, passed via `createOrigam({ code })`.
- * Today it carries a single knob — `highlighter` — but it is its own
+ * Today it carries two knobs — `highlighter` and `langs` — and it is its own
  * interface (rather than a bare function on `IOrigamOptions`) so a future
  * `OrigamCode`-wide setting (e.g. a default theme pair) has somewhere to
  * land without another breaking shape change.
@@ -116,6 +120,23 @@ export interface ICodeProps extends ICommonsComponentProps, ITagProps, IBorderPr
  ********************************************************/
 export interface ICodeOptions {
     highlighter?: TShikiHighlighterLoader;
+    /*********************************************************
+     * langs
+     *
+     * @description
+     * Grammars handed to `createHighlighter({ langs })`. Default:
+     * `SUPPORTED_LANGS` (the 14 bundled ones). Replaces the default list when
+     * set — include `plaintext` if you rely on it.
+     *
+     * @description
+     * With the built-in highlighter, a `lang` listed here is accepted instead
+     * of being folded onto `plaintext`; with a custom `highlighter`, `lang` is
+     * never filtered, and this only controls what is loaded up front.
+     *
+     * @description
+     * Like `highlighter`, read once (first `<OrigamCode>` to mount wins).
+     ********************************************************/
+    langs?: ReadonlyArray<string>;
 }
 /** Emits fired by `<OrigamCode>` — copy-to-clipboard confirmation. */
 export interface ICodeEmits {
@@ -127,7 +148,7 @@ export interface ICodeSlots {
      *  consumer can rebuild the default filename/lang badge + copy button. */
     header?: (data: {
         filename: string | undefined;
-        langName: TCodeLang | undefined;
+        langName: TCodeLangOpen | undefined;
         copy: () => Promise<void>;
         copied: boolean;
     }) => any;
@@ -146,7 +167,7 @@ export interface IUseCodeReturn {
      * underlying shiki highlighter has loaded the requested language /
      * theme (lazy; ~200 ms cold, instant on subsequent calls).
      */
-    highlight(code: string, lang: TCodeLang): Promise<string>;
+    highlight(code: string, lang: TCodeLangOpen): Promise<string>;
     /**
      * Force the highlighter to load. Useful for stories / tests that want
      * to warm the cache before mounting consumers.

package/dist/src/interfaces/CommandPalette/command-palette.interface.d.ts

@@ -1,4 +1,5 @@
 import type { ICommand } from './command.interface';
+import type { TCommandPaletteFilter } from '../../types/CommandPalette/command-palette.type';
 import type { IAttachProps } from '../Commons/attach.interface';
 import type { ICommonsComponentProps } from '../Commons/commons.interface';
 import type { ITypographyProps } from '../Commons/typography.interface';
@@ -27,6 +28,17 @@ export interface ICommandPaletteProps extends ICommonsComponentProps, Pick<ITypo
      * registered via the `useCommand()` global registry instead.
      */
     commands?: ReadonlyArray<ICommand>;
+    /*********************************************************
+     * filter (#1184)
+     *
+     * @description
+     * Comment `commands` est filtré selon la requête. `true` (défaut) : fuzzy match intégré, qui garde les sous-séquences et re-trie par score.
+     * @description
+     * `false` : `commands` affichées telles quelles, dans l'ordre fourni (liste déjà filtrée/classée par un serveur ou un moteur plein-texte, alimentée via l'event `query`).
+     * @description
+     * Fonction `(commands, query) => commands` : affiche ce qu'elle renvoie, dans son ordre. Dans les deux modes non défaut, la liste est plate (sans en-tête de groupe) tant que la requête est non vide, aucun match n'est surligné, et `commands` est honorée même vide (pas de repli sur le registre `useCommand()`).
+     ********************************************************/
+    filter?: TCommandPaletteFilter;
     /** Placeholder of the search input (already-translated string). */
     placeholder?: string;
     /** Empty-state message when no command matches the query. */

package/dist/src/types/Code/code.type.d.ts

@@ -1,7 +1,21 @@
 import { CODE_LANG, CODE_THEME } from '../../enums/Code/code.enum';
 import OrigamCode from '../../components/Code/OrigamCode.vue';
+import type { TAnyString } from '../Commons/commons.type';
 export type TOrigamCode = InstanceType<typeof OrigamCode>;
 export type TCodeLang = `${CODE_LANG}`;
+/*********************************************************
+ * TCodeLangOpen
+ *
+ * @description
+ * Open form of `TCodeLang` accepted by the `lang` prop (#1180): the 14 bundled
+ * grammars keep their autocompletion, any other string is allowed because a
+ * `createOrigam({ code: { highlighter, langs } })` highlighter can serve it.
+ *
+ * @description
+ * `TAnyString` (Commons) stops the union from collapsing to plain `string`,
+ * and avoids the empty-object intersection Sonar flags (#771).
+ ********************************************************/
+export type TCodeLangOpen = TCodeLang | TAnyString;
 export type TCodeTheme = `${CODE_THEME}`;
 /**
  * The slice of shiki's highlighter API that `useCode()` actually calls.

package/dist/src/types/CommandPalette/command-palette.type.d.ts

@@ -1,3 +1,4 @@
+import type { ICommand } from '../../interfaces/CommandPalette/command.interface';
 import OrigamCommandPalette from '../../components/CommandPalette/OrigamCommandPalette.vue';
 export type TOrigamCommandPalette = InstanceType<typeof OrigamCommandPalette>;
 /**
@@ -5,3 +6,13 @@ export type TOrigamCommandPalette = InstanceType<typeof OrigamCommandPalette>;
  * accepted by `useHotkey` (e.g. `['meta', 'k']`).
  */
 export type TCommandPaletteHotkeyCombination = ReadonlyArray<string>;
+/*********************************************************
+ * Filter de OrigamCommandPalette (#1184)
+ *
+ * @description
+ * `TCommandPaletteFilterFn` : reçoit les commandes et la requête brute (non trimée), renvoie les commandes à afficher, dans l'ordre d'affichage.
+ * @description
+ * `TCommandPaletteFilter` (prop `filter`) : `true` = fuzzy match intégré (filtre par sous-séquence + tri par score), `false` = `commands` affichées telles quelles et dans l'ordre fourni, fonction = son résultat est affiché dans son ordre.
+ ********************************************************/
+export type TCommandPaletteFilterFn = (commands: ReadonlyArray<ICommand>, query: string) => ReadonlyArray<ICommand>;
+export type TCommandPaletteFilter = boolean | TCommandPaletteFilterFn;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "origam",
-  "version": "2.33.0",
+  "version": "2.35.0",
   "type": "module",
   "description": "origam — a Vue 3 design system with multi-theme design tokens, CSS-first components and TypeScript types.",
   "keywords": [