@datalabz_/dashboard-kit 6.0.2 → 6.0.3

package/README.md

@@ -53,6 +53,28 @@ A major's files are one served bundle; the repo's per-file line budget
 (AGENTS.md #2) does not apply to it — it cannot be split without changing the
 URLs already pinned by live dashboards.
 
+## Asking a dashboard for its filters
+
+A parent may post `{ type: 'DK_GET_FILTERS_INFO' }` to a dashboard's frame; the kit answers the parent with
+`{ type: 'DK_FILTERS_INFO', filters: [...] }`. It needs no token or period, so a parent can ask as soon as
+the frame has loaded. The list is the controls in the dashboard's header — what it can be opened
+with — one entry each:
+
+```js
+{ id: 'playerUsername', label: 'Player username', type: 'text',  // type: the input's type, 'select' or 'textarea'
+  required: true, value: '',
+  placeholder, min, max,                    // only when the control sets them
+  disabled: true,                           // only when it is disabled
+  multiple: false, optionsTotal: 2,         // select only
+  options: [{ value: 'BRL', label: 'Real' }] }  // select only: the first 100 options
+```
+
+The whole header is read, so a control the dashboard adds to it after `init` is listed too. Left
+out: a control with no `id`, a second control with an `id` already listed, a password field, and
+radio, file, hidden and button controls, which the kit cannot fill. A select's options are those
+it has when asked: one the dashboard fills by a query later has none yet, and `optionsTotal` says how
+many there were. The answer always goes to the dashboard's parent, whoever asked.
+
 ## Rules
 
 - **Where a change lands — the current `vN` or a new major — is decided by

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@datalabz_/dashboard-kit",
-  "version": "6.0.2",
+  "version": "6.0.3",
   "description": "DashboardKit runtime + styles, served from jsDelivr",
   "license": "UNLICENSED",
   "files": [

package/v4.js

@@ -20,7 +20,7 @@
   let _activeTabId = '';
   let _sections = [];   // { id, label, load, loaded, errors }
   let _title = '';
-  let _gitVer = 'b3d1c2d'; // replaced at deploy: sed -i "s/b3d1c2d/$(git rev-parse --short HEAD)/g" v4.js
+  let _gitVer = '8ed9062'; // replaced at deploy: sed -i "s/8ed9062/$(git rev-parse --short HEAD)/g" v4.js
   let _calls = [];   // System Info call log
   let _sectionErrors = {}; // sectionId → error count
   let _generation = 0;

package/v5.js

@@ -20,7 +20,7 @@
   let _activeTabId = '';
   let _sections = [];   // { id, label, load, loaded, errors }
   let _title = '';
-  let _gitVer = 'b3d1c2d'; // replaced at deploy: sed -i "s/b3d1c2d/$(git rev-parse --short HEAD)/g" v4.js
+  let _gitVer = '8ed9062'; // replaced at deploy: sed -i "s/8ed9062/$(git rev-parse --short HEAD)/g" v4.js
   let _calls = [];   // System Info call log
   let _sectionErrors = {}; // sectionId → error count
   let _generation = 0;

package/v6.js

@@ -20,7 +20,7 @@
   let _activeTabId = '';
   let _sections = [];   // { id, label, load, loaded, errors }
   let _title = '';
-  let _gitVer = 'b3d1c2d'; // replaced at deploy: sed -i "s/b3d1c2d/$(git rev-parse --short HEAD)/g" v6.js
+  let _gitVer = '8ed9062'; // replaced at deploy: sed -i "s/8ed9062/$(git rev-parse --short HEAD)/g" v6.js
   let _calls = [];   // System Info call log
   let _sectionErrors = {}; // sectionId → error count
   let _generation = 0;
@@ -931,8 +931,75 @@ details.dk-call summary::-webkit-details-marker {
     } catch { return false; }
   }
 
+  // ── Filters a parent can ask for ──────────────────────────────────────────────
+  // DK_GET_FILTERS_INFO from the parent is answered with DK_FILTERS_INFO: the controls a dashboard keeps in
+  // its header, which are what it can be opened with. It needs no token or period, so a parent can
+  // ask as soon as the frame has loaded. Left out: controls the kit cannot fill (radio, file,
+  // hidden, buttons), a password field, a control with no id, and a second control with an id
+  // already listed. The whole header is read, so a control a dashboard adds to it after init is listed.
+  const FILTER_SKIP_TYPES = ['radio', 'file', 'hidden', 'button', 'submit', 'reset', 'image', 'password'];
+  const FILTER_MAX_OPTIONS = 100;
+  const FILTER_MAX_TEXT = 500;
+
+  function _clip(s, n) {
+    s = String(s == null ? '' : s);
+    return s.length > n ? s.slice(0, n) : s;
+  }
+
+  function _filterLabel(el) {
+    const wrap = el.labels && el.labels[0];
+    if (wrap) {
+      const c = wrap.cloneNode(true);
+      c.querySelectorAll('input, select, textarea, .dk-tip, [aria-hidden="true"], script, style').forEach(function (n) { n.remove(); });
+      const t = c.textContent.replace(/\s+/g, ' ').trim();
+      if (t) return _clip(t, 200);
+    }
+    return _clip(el.getAttribute('aria-label') || el.getAttribute('placeholder') || '', 200);
+  }
+
+  function _dashboardFilters() {
+    const header = document.querySelector('[data-dk-header]');
+    const out = [];
+    if (!header) return out;
+    const seen = {};
+    header.querySelectorAll('input, select, textarea').forEach(function (el) {
+      if (!el.id || seen[el.id] || FILTER_SKIP_TYPES.indexOf(el.type) >= 0) return;
+      seen[el.id] = true;
+      const isSelect = el.tagName === 'SELECT';
+      const f = {
+        id: el.id,
+        label: _filterLabel(el),
+        type: isSelect ? 'select' : el.tagName === 'TEXTAREA' ? 'textarea' : el.type,
+        required: el.required,
+      };
+      if (el.disabled) f.disabled = true;
+      if (!isSelect) {
+        ['placeholder', 'min', 'max'].forEach(function (a) {
+          if (el.getAttribute(a) !== null) f[a] = _clip(el.getAttribute(a), 100);
+        });
+      }
+      if (isSelect) {
+        f.multiple = el.multiple;
+        f.optionsTotal = el.options.length;
+        f.options = Array.from(el.options).slice(0, FILTER_MAX_OPTIONS).map(function (o) {
+          return { value: _clip(o.value, 200), label: _clip(o.textContent.trim(), 200) };
+        });
+        f.value = el.multiple ? Array.from(el.selectedOptions).map(function (o) { return o.value; }) : el.value;
+      } else {
+        f.value = el.type === 'checkbox' ? el.checked : _clip(el.value, FILTER_MAX_TEXT);
+      }
+      out.push(f);
+    });
+    return out;
+  }
+
+
   function _onMessage(e) {
     if (!e.data || typeof e.data !== 'object') return;
+    if (e.data.type === 'DK_GET_FILTERS_INFO') {
+      window.parent.postMessage({ type: 'DK_FILTERS_INFO', filters: _dashboardFilters() }, '*');
+      return;
+    }
     if (e.data.type === 'RK_SNAPSHOT') { _snapshot(); return; }
     if (e.data.type === 'CHAT_MODE') { document.documentElement.dataset.chatMode = 'true'; return; }
     if (e.data.type !== 'CUSTOM_DASHBOARDS_PARAMS') return;

package/wrapper.css

@@ -52,6 +52,15 @@ header.topbar {
   flex-wrap: wrap;
   flex-shrink: 0;
 }
+.platform-badge {
+  font-size: 14px;
+  font-weight: 700;
+  white-space: nowrap;
+  color: var(--text);
+}
+.platform-badge b {
+  color: var(--brand);
+}
 header .filters {
   display: flex;
   gap: 10px;

package/wrapper.js

@@ -1,17 +1,41 @@
 (function () {
   "use strict";
 
-  const API_BASE = "https://bcproxy.draftplaza.com";
-  const LS_TIMEZONE = "iqg.harness.timezone";
-  const LS_TOKEN = "iqg.harness.token";
-  const LS_USER = "iqg.harness.user";
-  const LS_THEME = "iqg.harness.theme";
+  // Where each platform's BackOffice lives; the page picks one with <script src=".../wrapper.js" data-platform="poker">.
+  // No data-platform means igaming, as before. An unknown name is an error, never a guess.
+  //   apiBase                  — sign-in (the BackOffice's own API)
+  //   gatewayEndpoint          — the SQL gateway a dashboard's queries go to, sent as `endpoint`
+  //   storagePrefix            — localStorage key prefix, so the two keep their own sign-in on one origin
+  //   label                    — the name in the top bar, before the word "Platform", that says which BackOffice this page talks to
+  const PLATFORMS = {
+    igaming: {
+      label: "iGaming",
+      apiBase: "https://bcproxy.draftplaza.com",
+      gatewayEndpoint: "https://aidqgateway.draftplaza.com/aidq",
+      storagePrefix: "iqg.harness.",
+    },
+    poker: {
+      label: "Poker",
+      apiBase: "https://pokerreporting.pokerplaza.com",
+      gatewayEndpoint: "https://aidqgateway.pokerplaza.com/aidq",
+      storagePrefix: "iqg.harness.poker.",
+    },
+  };
+  const platformName = (document.currentScript && document.currentScript.dataset.platform) || "igaming";
+  const CFG = PLATFORMS[platformName];
+  if (!CFG) throw new Error('wrapper: data-platform "' + platformName + '" is not one of ' + Object.keys(PLATFORMS).join(", "));
+  const API_BASE = CFG.apiBase;
+  const LS_TIMEZONE = CFG.storagePrefix + "timezone";
+  const LS_TOKEN = CFG.storagePrefix + "token";
+  const LS_USER = CFG.storagePrefix + "user";
+  const LS_THEME = CFG.storagePrefix + "theme";
 
   // Capture srcdoc from the inline iframe before DOM rebuild.
   const _srcdoc = document.getElementById("iframe")?.getAttribute("srcdoc") || "";
 
   document.body.innerHTML = `
     <header class="topbar">
+      <span class="platform-badge" id="platformBadge"></span>
       <div class="filters">
         <label>Date
           <select id="datePreset">
@@ -94,6 +118,10 @@
     <div class="toast" id="toast"></div>`;
 
   document.getElementById("iframe").setAttribute("srcdoc", _srcdoc);
+  const badge = document.getElementById("platformBadge");
+  badge.innerHTML = "<b></b> Platform";
+  badge.firstChild.textContent = CFG.label;
+  document.title = CFG.label + " · " + document.title;
 
   // ── Helpers ──────────────────────────────────────────────────────────────────
 
@@ -179,6 +207,8 @@
     const hid = State.filters.hierarchyId;
     return {
       type: "CUSTOM_DASHBOARDS_PARAMS", token: State.token, theme: State.theme,
+      // The SQL gateway of this BackOffice; the kit would otherwise use its own default.
+      endpoint: CFG.gatewayEndpoint,
       filters: {
         dateFrom: r.dateFromIso, dateTo: r.dateToIso, timezone: tz,
         hierarchyId: hid == null || Number.isNaN(hid) ? null : Number(hid)