Rules for a clean interface, and the modules brought to them

Seven rules join the four in the module guide, as rules 5 to 11: no
explanatory text in a tile's gear and no label over three words; server-side
settings in configSchema only; a tile setting changes that tile alone;
hide-toggles ungrouped when there are four or fewer and in a folded "Show"
group when there are five or more; title-bar controls are icons with
tooltips, never names; anything needing words belongs in the gear; and one
control per action, either place but not both.

Two passages said the opposite and now say the same thing — "keep labels
short and put the explanation there" is scoped to configSchema, and "icon
buttons, short labels" becomes icons with no labels at all. CLAUDE.md
carries the summary.

Then the modules. Nothing here changes a setting key or a default, so saved
layouts, named layouts and every tile already on a wall keep working; group
names, labels, help and fold state are presentation and are not stored.

- pco-plan: sixteen labels cut to three words or fewer ("Tint items by type
  (song / media / other)" is now "Tint by type"), "Show / hide" renamed
  "Show" and folded. Its one remaining help line stays by request: the top
  bar's template needs its separator syntax spelled out, which the variable
  chips beside it cannot convey, so rule 5 carves out template fields.
- propresenter-timers: the "Timers ▾" menu was the only named control left
  in any title bar. It is a stopwatch icon now, with the count riding
  alongside it while some timers are hidden — setLabel() writes over the
  button's contents, so the count needed ProdCom's badge treatment rather
  than a label. "Show" folds; the Colours help goes.
- propresenter-now-next: "Show" folds, in the manifest and in the Now
  entry's own copy.
- prodcom-transcript: "Show channel icons" loses the redundant verb.

slack and clock were already compliant and are untouched.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

modules/pco-plan/module.json

@@ -1,15 +1,23 @@
 {
   "id": "pco-plan",
   "name": "PCO Plan",
-  "version": "1.4.0",
+  "version": "1.5.0",
   "proddash": ">=1.4.0",
   "description": "Order of service from Planning Center Services",
-  "provides": ["timers"],
+  "provides": [
+    "timers"
+  ],
   "client": "client.js",
   "server": "server.js",
   "style": "style.css",
-  "minSize": { "w": 3, "h": 3 },
-  "defaultSize": { "w": 5, "h": 6 },
+  "minSize": {
+    "w": 3,
+    "h": 3
+  },
+  "defaultSize": {
+    "w": 5,
+    "h": 6
+  },
   "configGroups": {
     "Planning Center credentials": {
       "collapsed": "whenSet",
@@ -48,7 +56,12 @@
       "type": "select",
       "label": "Plan",
       "default": "",
-      "options": [{ "value": "", "label": "Automatic — today's plan, else the next upcoming" }],
+      "options": [
+        {
+          "value": "",
+          "label": "Automatic — today's plan, else the next upcoming"
+        }
+      ],
       "optionsRoute": "/plans",
       "optionsDependsOn": "serviceTypeId"
     },
@@ -82,8 +95,14 @@
       "group": "Service timing",
       "showWhen": "useDocumentTriggers",
       "options": [
-        { "value": "schedule", "label": "Scheduled service time" },
-        { "value": "document", "label": "ProPresenter document" }
+        {
+          "value": "schedule",
+          "label": "Scheduled service time"
+        },
+        {
+          "value": "document",
+          "label": "ProPresenter document"
+        }
       ]
     },
     "serviceStartDocument": {
@@ -124,37 +143,94 @@
     "Item notes": {
       "toggle": "showNotes"
     },
-    "Show / hide": {
+    "Show": {
       "collapsed": true,
-      "columns": 3,
-      "help": "Switch off anything this tile should not show."
+      "columns": 2
     }
   },
   "instanceSchema": {
-    "autoScroll": { "type": "boolean", "label": "Keep the current item in view", "default": true },
+    "autoScroll": {
+      "type": "boolean",
+      "label": "Auto-scroll",
+      "default": true
+    },
     "headerTemplate": {
       "type": "template",
       "label": "Top bar text",
       "default": "{series} • {part} | {serviceType} • {date}",
       "group": "Top bar",
       "variables": [
-        { "value": "{series}", "label": "Series" },
-        { "value": "{part}", "label": "Part / plan title" },
-        { "value": "{serviceType}", "label": "Service type" },
-        { "value": "{date}", "label": "Date" },
-        { "value": "{shortDate}", "label": "Short date" },
-        { "value": "{time}", "label": "Service time" },
-        { "value": "{length}", "label": "Planned length" },
-        { "value": "{items}", "label": "Item count" }
+        {
+          "value": "{series}",
+          "label": "Series"
+        },
+        {
+          "value": "{part}",
+          "label": "Part / plan title"
+        },
+        {
+          "value": "{serviceType}",
+          "label": "Service type"
+        },
+        {
+          "value": "{date}",
+          "label": "Date"
+        },
+        {
+          "value": "{shortDate}",
+          "label": "Short date"
+        },
+        {
+          "value": "{time}",
+          "label": "Service time"
+        },
+        {
+          "value": "{length}",
+          "label": "Planned length"
+        },
+        {
+          "value": "{items}",
+          "label": "Item count"
+        }
       ],
       "help": "Use • between items and | to start a second line."
     },
-    "keyColor": { "type": "color", "label": "Song key", "default": "#4ea1ff", "group": "Colors" },
-    "headerColor": { "type": "color", "label": "Section headers", "default": "#2ee59a", "group": "Colors" },
-    "currentColor": { "type": "color", "label": "Current item", "default": "#2ee59a", "group": "Colors" },
-    "headerGradient": { "type": "boolean", "label": "Fade header color to the right", "default": true, "group": "Colors" },
-    "tintByType": { "type": "boolean", "label": "Tint items by type (song / media / other)", "default": false, "group": "Colors" },
-    "showNotes": { "type": "switch", "label": "Item notes", "default": true, "group": "Item notes" },
+    "keyColor": {
+      "type": "color",
+      "label": "Song key",
+      "default": "#4ea1ff",
+      "group": "Colors"
+    },
+    "headerColor": {
+      "type": "color",
+      "label": "Section headers",
+      "default": "#2ee59a",
+      "group": "Colors"
+    },
+    "currentColor": {
+      "type": "color",
+      "label": "Current item",
+      "default": "#2ee59a",
+      "group": "Colors"
+    },
+    "headerGradient": {
+      "type": "boolean",
+      "label": "Header fade",
+      "default": true,
+      "group": "Colors"
+    },
+    "tintByType": {
+      "type": "boolean",
+      "label": "Tint by type",
+      "default": false,
+      "group": "Colors"
+    },
+    "showNotes": {
+      "type": "switch",
+      "label": "Item notes",
+      "default": true,
+      "group": "Item notes"
+    },
     "noteCategories": {
       "type": "multiselect",
       "label": "Categories",
@@ -163,29 +239,149 @@
       "columns": 3,
       "allByDefault": true
     },
-    "showTopBar": { "type": "boolean", "label": "Top bar", "default": true, "group": "Show / hide" },
-    "showSeries": { "type": "boolean", "label": "Series name", "default": true, "group": "Show / hide" },
-    "showPart": { "type": "boolean", "label": "Part # / plan title", "default": true, "group": "Show / hide" },
-    "showServiceType": { "type": "boolean", "label": "Service type", "default": true, "group": "Show / hide" },
-    "showDate": { "type": "boolean", "label": "Plan date", "default": true, "group": "Show / hide" },
-    "showServiceTime": { "type": "boolean", "label": "Service time", "default": true, "group": "Show / hide" },
-    "showTotalLength": { "type": "boolean", "label": "Planned total length", "default": true, "group": "Show / hide" },
-    "showRunningClock": { "type": "boolean", "label": "Running clock (ahead / behind)", "default": true, "group": "Show / hide" },
-    "showCountdown": { "type": "boolean", "label": "Countdown to service start", "default": true, "group": "Show / hide" },
-    "showHeaders": { "type": "boolean", "label": "Section headers", "default": true, "group": "Show / hide" },
-    "showItemNumbers": { "type": "boolean", "label": "Item numbers", "default": false, "group": "Show / hide" },
-    "showStartTimes": { "type": "boolean", "label": "Scheduled start times", "default": true, "group": "Show / hide" },
-    "showLength": { "type": "boolean", "label": "Item length", "default": true, "group": "Show / hide" },
-    "showItemType": { "type": "boolean", "label": "Item type badge", "default": true, "group": "Show / hide" },
-    "showKey": { "type": "boolean", "label": "Song key", "default": true, "group": "Show / hide" },
-    "showArrangement": { "type": "boolean", "label": "Song arrangement", "default": false, "group": "Show / hide" },
-    "showSongAuthor": { "type": "boolean", "label": "Song author / CCLI", "default": false, "group": "Show / hide" },
-    "showDescription": { "type": "boolean", "label": "Item description", "default": true, "group": "Show / hide" },
-    "showPreService": { "type": "boolean", "label": "Pre-service items", "default": true, "group": "Show / hide" },
-    "showPostService": { "type": "boolean", "label": "Post-service items", "default": true, "group": "Show / hide" },
-    "showNowIndicator": { "type": "boolean", "label": "Now indicator", "default": true, "group": "Show / hide" },
-    "showItemRuntime": { "type": "boolean", "label": "Item runtime (elapsed vs planned)", "default": true, "group": "Show / hide" },
-    "dimCompleted": { "type": "boolean", "label": "Dim completed items", "default": true, "group": "Show / hide" },
-    "showLiveFooter": { "type": "boolean", "label": "ProPresenter match line", "default": true, "group": "Show / hide" }
+    "showTopBar": {
+      "type": "boolean",
+      "label": "Top bar",
+      "default": true,
+      "group": "Show"
+    },
+    "showSeries": {
+      "type": "boolean",
+      "label": "Series name",
+      "default": true,
+      "group": "Show"
+    },
+    "showPart": {
+      "type": "boolean",
+      "label": "Part / title",
+      "default": true,
+      "group": "Show"
+    },
+    "showServiceType": {
+      "type": "boolean",
+      "label": "Service type",
+      "default": true,
+      "group": "Show"
+    },
+    "showDate": {
+      "type": "boolean",
+      "label": "Plan date",
+      "default": true,
+      "group": "Show"
+    },
+    "showServiceTime": {
+      "type": "boolean",
+      "label": "Service time",
+      "default": true,
+      "group": "Show"
+    },
+    "showTotalLength": {
+      "type": "boolean",
+      "label": "Total length",
+      "default": true,
+      "group": "Show"
+    },
+    "showRunningClock": {
+      "type": "boolean",
+      "label": "Running clock",
+      "default": true,
+      "group": "Show"
+    },
+    "showCountdown": {
+      "type": "boolean",
+      "label": "Countdown",
+      "default": true,
+      "group": "Show"
+    },
+    "showHeaders": {
+      "type": "boolean",
+      "label": "Section headers",
+      "default": true,
+      "group": "Show"
+    },
+    "showItemNumbers": {
+      "type": "boolean",
+      "label": "Item numbers",
+      "default": false,
+      "group": "Show"
+    },
+    "showStartTimes": {
+      "type": "boolean",
+      "label": "Start times",
+      "default": true,
+      "group": "Show"
+    },
+    "showLength": {
+      "type": "boolean",
+      "label": "Item length",
+      "default": true,
+      "group": "Show"
+    },
+    "showItemType": {
+      "type": "boolean",
+      "label": "Type badge",
+      "default": true,
+      "group": "Show"
+    },
+    "showKey": {
+      "type": "boolean",
+      "label": "Song key",
+      "default": true,
+      "group": "Show"
+    },
+    "showArrangement": {
+      "type": "boolean",
+      "label": "Arrangement",
+      "default": false,
+      "group": "Show"
+    },
+    "showSongAuthor": {
+      "type": "boolean",
+      "label": "Author / CCLI",
+      "default": false,
+      "group": "Show"
+    },
+    "showDescription": {
+      "type": "boolean",
+      "label": "Item description",
+      "default": true,
+      "group": "Show"
+    },
+    "showPreService": {
+      "type": "boolean",
+      "label": "Pre-service",
+      "default": true,
+      "group": "Show"
+    },
+    "showPostService": {
+      "type": "boolean",
+      "label": "Post-service",
+      "default": true,
+      "group": "Show"
+    },
+    "showNowIndicator": {
+      "type": "boolean",
+      "label": "Now indicator",
+      "default": true,
+      "group": "Show"
+    },
+    "showItemRuntime": {
+      "type": "boolean",
+      "label": "Item runtime",
+      "default": true,
+      "group": "Show"
+    },
+    "dimCompleted": {
+      "type": "boolean",
+      "label": "Dim completed",
+      "default": true,
+      "group": "Show"
+    },
+    "showLiveFooter": {
+      "type": "boolean",
+      "label": "Match line",
+      "default": true,
+      "group": "Show"
+    }
   }
 }

modules/prodcom-transcript/module.json

@@ -1,7 +1,7 @@
 {
   "id": "prodcom-transcript",
   "name": "ProdCom",
-  "version": "1.3.1",
+  "version": "1.3.2",
   "proddash": ">=1.1.0",
   "description": "Live ProdCom transcript",
   "permissions": [
@@ -40,7 +40,7 @@
   "instanceSchema": {
     "showAvatars": {
       "type": "boolean",
-      "label": "Show channel icons",
+      "label": "Channel icons",
       "default": true
     }
   }

modules/propresenter-now-next/module.json

@@ -1,22 +1,34 @@
 {
   "id": "propresenter-now-next",
   "name": "ProPresenter",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "proddash": ">=1.5.0",
   "description": "What is live in ProPresenter and what comes next",
   "permissions": [
-    { "kind": "local-network", "reason": "Reaching ProPresenter on this network" }
+    {
+      "kind": "local-network",
+      "reason": "Reaching ProPresenter on this network"
+    }
   ],
   "client": "client.js",
   "server": "server.js",
   "style": "style.css",
-  "minSize": { "w": 3, "h": 3 },
-  "defaultSize": { "w": 4, "h": 5 },
+  "minSize": {
+    "w": 3,
+    "h": 3
+  },
+  "defaultSize": {
+    "w": 4,
+    "h": 5
+  },
   "configSchema": {
     "propresenter": {
       "type": "endpoint",
       "label": "ProPresenter",
-      "default": { "host": "", "port": 1025 }
+      "default": {
+        "host": "",
+        "port": 1025
+      }
     },
     "password": {
       "type": "password",
@@ -25,17 +37,64 @@
     }
   },
   "instanceSchema": {
-    "cleanTitles": { "type": "switch", "label": "Tidy titles", "default": true },
-    "showPlaylist": { "type": "switch", "label": "Playlist", "default": true, "group": "Show" },
-    "showLive": { "type": "switch", "label": "Live status", "default": true, "group": "Show" },
-    "showNowLabel": { "type": "switch", "label": "Now label", "default": true, "group": "Show" },
-    "showSlideCount": { "type": "switch", "label": "Slide count", "default": true, "group": "Show" },
-    "showProgress": { "type": "switch", "label": "Progress bar", "default": true, "group": "Show" },
-    "showNext": { "type": "switch", "label": "Next list", "default": true, "group": "Show" },
-    "showNextLabel": { "type": "switch", "label": "Next label", "default": true, "group": "Show" },
-    "showTags": { "type": "switch", "label": "Item tags", "default": true, "group": "Show" }
+    "cleanTitles": {
+      "type": "switch",
+      "label": "Tidy titles",
+      "default": true
+    },
+    "showPlaylist": {
+      "type": "switch",
+      "label": "Playlist",
+      "default": true,
+      "group": "Show"
+    },
+    "showLive": {
+      "type": "switch",
+      "label": "Live status",
+      "default": true,
+      "group": "Show"
+    },
+    "showNowLabel": {
+      "type": "switch",
+      "label": "Now label",
+      "default": true,
+      "group": "Show"
+    },
+    "showSlideCount": {
+      "type": "switch",
+      "label": "Slide count",
+      "default": true,
+      "group": "Show"
+    },
+    "showProgress": {
+      "type": "switch",
+      "label": "Progress bar",
+      "default": true,
+      "group": "Show"
+    },
+    "showNext": {
+      "type": "switch",
+      "label": "Next list",
+      "default": true,
+      "group": "Show"
+    },
+    "showNextLabel": {
+      "type": "switch",
+      "label": "Next label",
+      "default": true,
+      "group": "Show"
+    },
+    "showTags": {
+      "type": "switch",
+      "label": "Item tags",
+      "default": true,
+      "group": "Show"
+    }
   },
   "instanceGroups": {
-    "Show": { "collapsed": false, "columns": 2 }
+    "Show": {
+      "collapsed": true,
+      "columns": 2
+    }
   }
 }

modules/propresenter-now-next/server.js

@@ -140,7 +140,7 @@ module.exports = {
           showSlideCount: { type: 'switch', label: 'Slide count', default: true, group: 'Show' },
           showProgress: { type: 'switch', label: 'Progress bar', default: true, group: 'Show' },
         },
-        instanceGroups: { Show: { collapsed: false, columns: 2 } },
+        instanceGroups: { Show: { collapsed: true, columns: 2 } },
       },
     ];
   },

modules/propresenter-timers/client.js

@@ -15,7 +15,7 @@
 
    Per-tile choices: the gear popover's static switches (whole sources,
    headings, status lines, the clock's format, the state colours) and the
-   "Timers ▾" header menu, which hides any single timer — keyed `source:id`
+   timers header menu, which hides any single timer — keyed `source:id`
    and saved with the layout via saveInstanceSettings. The header can be
    hidden by the user, so the static switches stay the primary controls.
    A solo tile's gear carries only the settings its one card can use (the
@@ -196,6 +196,10 @@ function defaultStatus(timer, value, tone) {
 
 /* ── the tile ─────────────────────────────────────────────────────────── */
 
+/* The header menu's icon: a stopwatch, for the list of timers behind it.
+   Title-bar controls carry no words (module guide, rule 9). */
+const TIMERS_SVG = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M10 2h4"/><path d="M12 14V9"/><circle cx="12" cy="14" r="8"/></svg>';
+
 export default function create({ root, moduleApi }) {
   let state = null;
   let feedOffline = false;
@@ -227,7 +231,7 @@ export default function create({ root, moduleApi }) {
   }
 
   /* Which picker entry this tile was added as (the module's tiles() list):
-     '' or 'all' = every timer, selectable via the Timers ▾ menu;
+     '' or 'all' = every timer, selectable via the timers menu;
      'solo:<source>:<id>' = exactly one card, no menu, no headings. The
      earlier entries 'timer:<uuid>' and 'ltc' map onto the new keys. */
   const variant = String(moduleApi.variant || '');
@@ -283,8 +287,8 @@ export default function create({ root, moduleApi }) {
 
   let menuEl = null; // the open menu's element (filled on each open)
   const itemsMenu = solo ? null : moduleApi.header.addMenu({
-    label: 'Timers ▾',
-    title: 'Choose timers',
+    icon: TIMERS_SVG,
+    title: 'Timers',
     build(menu) {
       // the shell hands over an emptied element on every open
       menu.classList.add('tm-menu');
@@ -292,6 +296,12 @@ export default function create({ root, moduleApi }) {
       rebuildMenu(true);
     },
   });
+  // The icon carries the name; a count rides alongside it while some timers
+  // are hidden, so the bar says "filtered" without saying it in words.
+  const itemsCountEl = document.createElement('span');
+  itemsCountEl.className = 'tm-count';
+  itemsCountEl.hidden = true;
+  if (itemsMenu) itemsMenu.button.appendChild(itemsCountEl);
 
   function menuRows() {
     const rows = [];
@@ -319,7 +329,9 @@ export default function create({ root, moduleApi }) {
     if (!itemsMenu) return;
     const rows = menuRows();
     const visible = rows.filter((r) => !hidden.has(r.key)).length;
-    itemsMenu.setLabel(visible === rows.length ? 'Timers ▾' : `Timers (${visible}/${rows.length}) ▾`);
+    const filtering = visible !== rows.length;
+    itemsCountEl.textContent = filtering ? `${visible}/${rows.length}` : '';
+    itemsCountEl.hidden = !filtering;
   }
 
   let menuSignature = '';
@@ -779,7 +791,7 @@ export default function create({ root, moduleApi }) {
     let hint = '';
     const groups = visibleGroups();
     if (state && !state.sources.length) hint = 'Every source is switched off — turn one on in Admin.';
-    else if (state && !groups.length) hint = 'Nothing selected — switch a source on in this tile’s settings, or pick timers in the Timers ▾ menu.';
+    else if (state && !groups.length) hint = 'Nothing selected — switch a source on in this tile’s settings, or pick timers in the title bar’s timers menu.';
     hintEl.hidden = !hint;
     hintEl.textContent = hint;
     groupsEl.hidden = Boolean(hint);

modules/propresenter-timers/module.json

@@ -1,7 +1,7 @@
 {
   "id": "propresenter-timers",
   "name": "Timers",
-  "version": "1.3.0",
+  "version": "1.4.0",
   "proddash": ">=1.4.0",
   "description": "Timers, Clocks, and LTC From configured Modules",
   "provides": [
@@ -112,7 +112,7 @@
   },
   "instanceGroups": {
     "Show": {
-      "collapsed": false,
+      "collapsed": true,
       "columns": 2
     },
     "Clock": {
@@ -121,8 +121,7 @@
     },
     "Colours": {
       "collapsed": true,
-      "columns": 2,
-      "help": "The time's colour per state. Left at the default, a colour follows the dashboard theme; one you change here wins over it."
+      "columns": 2
     }
   },
   "instanceSchema": {

modules/propresenter-timers/style.css

@@ -321,7 +321,7 @@
 
 @keyframes tm-nosignal-blink { 50% { opacity: 0.35; } }
 
-/* ── the "Timers ▾" menu (container styled/positioned by the shell) ── */
+/* ── the timers menu (container styled/positioned by the shell) ── */
 
 [data-module="propresenter-timers"] .tm-menu-item {
   display: flex;
@@ -383,3 +383,11 @@
   font-size: 12px;
   white-space: nowrap;
 }
+
+/* the count beside the title-bar timers icon, while some are hidden */
+[data-module="propresenter-timers"] .tm-count {
+  font-size: 10px;
+  font-weight: 700;
+  font-variant-numeric: tabular-nums;
+}
+[data-module="propresenter-timers"] .tm-count[hidden] { display: none; }