openvibe-shared v4.228.0 (was v4.227.0) (#297)

ddiff --git a/README.md b/README.md
iindex cfa13d0..59a3437 100644
---- a/README.md
++++ b/README.md
@@@ -661,5 +661,5 @@ POSTs have their own per-address limit zones (nginx refuses `limit_req` inside `
  <!-- versions:start -->
  - openvibe-contracts: v0.417.0
  - openvibe-sdk: v0.161.0
--- openvibe-shared: v4.227.0
++- openvibe-shared: v4.228.0
  <!-- versions:end -->
ddiff --git a/STATUS.json b/STATUS.json
iindex b60be16..f4acdc1 100644
---- a/STATUS.json
++++ b/STATUS.json
@@@ -9,7 +9,7 @@
    "domain": "openvibe.watch (a public server-rendered site + a loopback-only API; vhost in deploy/nginx; README \"Public site\" and \"Public host\")",
    "contracts": "openvibe-contracts v0.417.0 (watch.rate.* events; actor-agent requires v0.143.0)",
    "sdk": "openvibe-sdk v0.161.0",
--  "shared": "openvibe-shared v4.227.0",
++  "shared": "openvibe-shared v4.228.0",
    "capabilities": [
      "watch.watch.read",
      "watch.watch.manage",
ddiff --git a/package-lock.json b/package-lock.json
iindex 574b26b..7721134 100644
---- a/package-lock.json
++++ b/package-lock.json
@@@ -14,7 +14,7 @@
          "fast-xml-parser": "^4.5.3",
          "openvibe-contracts": "https://codeload.github.com/OpenVibers/OpenVibe.Contracts/tar.gz/refs/tags/v0.417.0",
          "openvibe-sdk": "https://codeload.github.com/OpenVibers/OpenVibe.SDK/tar.gz/refs/tags/v0.161.0",
--        "openvibe-shared": "https://codeload.github.com/OpenVibers/OpenVibe.Shared/tar.gz/refs/tags/v4.227.0",
++        "openvibe-shared": "https://codeload.github.com/OpenVibers/OpenVibe.Shared/tar.gz/refs/tags/v4.228.0",
          "pg": "^8.23.0"
        },
        "devDependencies": {
@@@ -1169,9 +1169,9 @@
        }
      },
      "node_modules/openvibe-shared": {
--      "version": "4.227.0",
--      "resolved": "https://codeload.github.com/OpenVibers/OpenVibe.Shared/tar.gz/refs/tags/v4.227.0",
--      "integrity": "sha512-/PqSqCC/vw/iwvkhDipLyixPyrtTcMpPhZ8UQ35fGDfAEJt43du2MYmZetu/TUysz+iJ9/Z7+VCFsFI1XzuF3Q==",
++      "version": "4.228.0",
++      "resolved": "https://codeload.github.com/OpenVibers/OpenVibe.Shared/tar.gz/refs/tags/v4.228.0",
++      "integrity": "sha512-HR0Hac/K+qKmwMf2QZWCFxW+uVja36nyAtxVbNFgPGUDFdmWhmb6RMoP/CkU0+GSCPsC50k6aTS+oPx2czDgGg==",
        "license": "MIT",
        "dependencies": {
          "clean-css": "^5.3.3",
ddiff --git a/package.json b/package.json
iindex 79ba4b6..2a58e5f 100644
---- a/package.json
++++ b/package.json
@@@ -26,7 +26,7 @@
      "fast-xml-parser": "^4.5.3",
      "openvibe-contracts": "https://codeload.github.com/OpenVibers/OpenVibe.Contracts/tar.gz/refs/tags/v0.417.0",
      "openvibe-sdk": "https://codeload.github.com/OpenVibers/OpenVibe.SDK/tar.gz/refs/tags/v0.161.0",
--    "openvibe-shared": "https://codeload.github.com/OpenVibers/OpenVibe.Shared/tar.gz/refs/tags/v4.227.0",
++    "openvibe-shared": "https://codeload.github.com/OpenVibers/OpenVibe.Shared/tar.gz/refs/tags/v4.228.0",
      "pg": "^8.23.0"
    },
    "engines": {
ddiff --git a/server/render/short.js b/server/render/short.js
iindex fea6554..4202039 100644
---- a/server/render/short.js
++++ b/server/render/short.js
@@@ -1,4 +1,5 @@
  'use strict';
++const { pick } = require('openvibe-shared/showcase');
  /**
   * The home on a phone (the owner's short-pages rule, 2026-10-30): one or two screens, app-like.
   *
@@@ -21,16 +22,11 @@ const esc = (s) => String(s == null ? '' : s).replace(/&/g, '&amp;').replace(/</
   *   pickBlock({ key, label, head, panes })   head: the heading of the block, or '' when the block already has one.
   *                                           panes: [{ id, label, html }]
   */
--function pickBlock({ key, label, head = '', panes, bodyClass = '' }) {
--    // A pane with nothing to show is left out, so the chips and the rules that show them match the page.
--    panes = (panes || []).filter((p) => p.html);
--    if (!panes.length) return '';
--    const chips = panes.map((p) => `<a class="pick-chip" href="#${esc(p.id)}">${esc(p.label)}</a>`).join('');
--    // The pane carries the id the page already links to (an anchor in the hero, for instance), so a link to it still
--    // opens that pane on a phone (the CSS shows the pane a link points at).
--    const body = panes.map((p) => `<div class="pick-pane" id="${esc(p.id)}">${p.html}</div>`).join('');
--    const bar = `${head ? `<div class="pick-head"><h2>${esc(head)}</h2></div>` : ''}<nav class="pick-row" aria-label="${esc(label)}">${chips}</nav>`;
--    return `<div class="pick" id="pick-${esc(key)}"><div class="pick-bar">${bar}</div><div class="pick-body${bodyClass ? ' ' + esc(bodyClass) : ''}">${body}</div></div>`;
++// 4.228.0: Shared's showcase.pick() draws the block (tabs on a phone, every pane in the page, a link to a pane opens
++// it); this copy only jumped to a pane with chips, so a phone showed them all (the owner, 11-12). The ids are this
++// site's own, so its links keep working.
++function pickBlock({ key, label, head = '', headId = '', bodyClass = '', panes, checked = '' }) {
++    return pick({ key, label, head, headId, bodyClass, checked: checked ? checked : '', panes: (panes || []).map((p) => ({ id: p.id, label: p.label, html: p.html })) });
  }
  
  
ddiff --git a/test/home-short.test.js b/test/home-short.test.js
iindex c3cf2e3..1fe5eb3 100644
---- a/test/home-short.test.js
++++ b/test/home-short.test.js
@@@ -31,12 +31,12 @@ t('the ready-made watches are chips: one per group, the first picked, every grou
      const page = home.text;
      assert.ok(page.includes('<div class="pick" id="pick-ready">'), 'the ready-made watches are a pick block');
      const block = page.slice(page.indexOf('<div class="pick" id="pick-ready">'));
--    const chips = [...block.matchAll(/<a class="pick-chip" href="#(?:pp-ready-)?([a-z]+)">()([^<]+)<\/a>/g)];
++    const chips = [...block.matchAll(/<label for="ovp-[a-z0-9]+-(?:pp-ready-)?([a-z]+)">()([^<]+)(?: <span class="ov-parts-n">[^<]*<\/span>)?<\/label>/g)];
      assert.deepStrictEqual(chips.map((m) => m[1]), ['prices', 'feeds', 'blogs'], 'a chip per group');
--    assert.ok(!/type="radio"/.test(block), 'no chip is a radio: nothing is picked, every pane shows');
--    // Every group stays in the page, with the id its chip picks.
++    assert.ok(/<input type=\"radio\" class=\"ov-parts-r\"[^>]* checked>/.test(block), 'the first part is open on a phone (Shared pick(): tabs, 11-12)');
++    // Every group stays in the page, with the id its tab opens.
      const panes = [...block.matchAll(/<div class="pick-pane" id="([a-z]+)">/g)].map((m) => m[1]);
--    assert.deepStrictEqual(panes, ['prices', 'feeds', 'blogs'], 'every group is in the page, one per chip');
++    assert.deepStrictEqual(panes, ['prices', 'feeds', 'blogs'], 'every group is in the page, one per tab');
      // Nothing was removed: the groups and their links are still there.
      for (const title of ['Hosting prices', 'Feeds', 'Blogs on OpenVibe', 'Watch this feed', 'Ready-made watches']) {
          assert.ok(page.includes(title), `${title} is on the page`);
ddiff --git a/test/home.test.js b/test/home.test.js
iindex 40cdc5c..95de037 100644
---- a/test/home.test.js
++++ b/test/home.test.js
@@@ -63,7 +63,8 @@ t('channels, live first, each with a "go live" watch filled in for it', async ()
  
  t('ready-made watches: a Host plan\'s price, feeds, and a blog\'s new posts', async () => {
      const home = await svc.get('/', { headers: { accept: 'text/html' } });
--    const ready = (/<section class="sc-sec" aria-labelledby="h-ready">[\s\S]*?<\/section>/.exec(home.text) || [''])[0];
++    // The block runs to the next page section: its panes are sections of their own (Shared 4.228.0's pick()).
++    const ready = (/<section class="sc-sec" aria-labelledby="h-ready">[\s\S]*?(?=<section class="sc-sec"|<footer|$)/.exec(home.text) || [''])[0];
      assert.match(ready, /template=json&amp;url=https%3A%2F%2Fopenvibe\.host%2Fapi%2Fv1%2Fcatalog%2Fplans%2Fhpl_01M4Z4ZZ6B8FC1ZEV0KAQ9XFBP&amp;value_path=plan\.price_monthly&amp;op=changed/);
      assert.match(ready, /template=feed&amp;url=https%3A%2F%2Fnodejs\.org%2Fen%2Ffeed%2Freleases\.xml/);
      assert.strictEqual((ready.match(/New posts on @openvibe/g) || []).length, 1, 'one card per blog, with its latest post');