@fusedashlabs/widgets 0.5.0 → 0.6.0

package/dist/element/chart-tooltip-portal.js

@@ -0,0 +1,278 @@
+const HOVER_ATTR = "data-ui9000-chart-tooltip";
+const LABEL_ATTR = "data-ui9000-label-tooltip";
+const STYLE_ID = "ui9000-chart-tooltip-style";
+let hoverOwner = null;
+let labelOwner = null;
+const TOOLTIP_CSS = `
+.ui9000-chart-tooltip {
+  position: absolute;
+  z-index: 1000;
+  display: none;
+  flex-direction: column;
+  gap: 8px;
+  box-sizing: border-box;
+  min-width: 110px;
+  padding: 8px 12px;
+  border: 1px solid var(--colors-neutral-border-weakest, #dfe1e4);
+  border-radius: 6px;
+  background: var(--colors-neutral-background-base, #fff);
+  color: var(--colors-neutral-text-default, #444547);
+  box-shadow:
+    0 2px 4px 0 rgba(20, 28, 44, 0.06),
+    0 4px 8px 2px rgba(20, 28, 44, 0.06);
+  pointer-events: none;
+  font-family: var(--ui9000-font-family, system-ui, sans-serif);
+  opacity: 0;
+  scale: 0.8;
+}
+.ui9000-chart-tooltip.is-open {
+  display: flex;
+  animation: ui9000-tooltip-in 0.2s forwards;
+}
+@keyframes ui9000-tooltip-in {
+  to { opacity: 1; scale: 1; }
+}
+.ui9000-chart-tooltip__title {
+  margin: 0;
+  font-size: 14px;
+  font-weight: 500;
+  line-height: 16px;
+  text-align: left;
+}
+.ui9000-chart-tooltip__rows {
+  display: flex;
+  flex-direction: column;
+  min-width: 110px;
+}
+.ui9000-chart-tooltip__row {
+  display: flex;
+  width: 100%;
+  justify-content: space-between;
+  flex-direction: row;
+  gap: 8px;
+  border-bottom: 1px dashed var(--colors-neutral-border-weakest, #dfe1e4);
+}
+.ui9000-chart-tooltip__row:last-child {
+  border: none;
+}
+.ui9000-chart-tooltip__label {
+  font-size: 12px;
+  line-height: 14px;
+  font-weight: 400;
+  margin: 2px 0;
+  min-width: 60px;
+  max-width: 120px;
+  max-height: 2lh;
+  overflow: hidden;
+  word-wrap: break-all;
+  text-overflow: ellipsis;
+  opacity: 0.6;
+}
+.ui9000-chart-tooltip__value {
+  font-size: 12px;
+  line-height: 14px;
+  font-weight: 500;
+  margin: 2px 0;
+  width: max-content;
+}
+.ui9000-chart-tooltip::after,
+.ui9000-chart-tooltip::before {
+  content: "";
+  position: absolute;
+  top: var(--ui9000-tip-top, 100%);
+  left: var(--ui9000-tip-left, 25px);
+  width: 0;
+  height: 0;
+  translate: -50%;
+}
+.ui9000-chart-tooltip[data-side='bottom']::after {
+  border-right: 5px solid transparent;
+  border-top: 8px solid var(--colors-neutral-background-base, #fff);
+  border-left: 5px solid transparent;
+}
+.ui9000-chart-tooltip[data-side='top']::after {
+  border-right: 5px solid transparent;
+  border-bottom: 8px solid var(--colors-neutral-background-base, #fff);
+  border-left: 5px solid transparent;
+}
+.ui9000-chart-tooltip[data-side='bottom']::before {
+  opacity: 0.1;
+  border-right: 7px solid transparent;
+  border-top: 8px solid #000;
+  border-left: 7px solid transparent;
+}
+.ui9000-chart-tooltip[data-side='top']::before {
+  opacity: 0.1;
+  border-right: 7px solid transparent;
+  border-bottom: 8px solid #000;
+  border-left: 7px solid transparent;
+}
+.ui9000-label-tooltip {
+  position: absolute;
+  z-index: 100;
+  display: none;
+  box-sizing: border-box;
+  padding: 2px 5px;
+  border: 1px solid var(--colors-neutral-border-weakest, #dfe1e4);
+  border-radius: 5px;
+  background: var(--colors-neutral-background-base, #fff);
+  color: var(--colors-neutral-text-weak, #6c7584);
+  font-family: var(--ui9000-font-family, system-ui, sans-serif);
+  font-size: 11px;
+  font-weight: 400;
+  line-height: 1.35;
+  pointer-events: none;
+  white-space: nowrap;
+}
+.ui9000-label-tooltip.is-open {
+  display: block;
+}
+`;
+function ensureStyle() {
+  if (typeof document === "undefined") return;
+  if (document.getElementById(STYLE_ID)) return;
+  const style = document.createElement("style");
+  style.id = STYLE_ID;
+  style.textContent = TOOLTIP_CSS;
+  document.head.appendChild(style);
+}
+function hoverRoot() {
+  if (typeof document === "undefined") return null;
+  ensureStyle();
+  let el = document.querySelector(`[${HOVER_ATTR}]`);
+  if (!el) {
+    el = document.createElement("div");
+    el.setAttribute(HOVER_ATTR, "");
+    el.className = "ui9000-chart-tooltip";
+    el.dataset.side = "bottom";
+    document.body.appendChild(el);
+  }
+  return el;
+}
+function labelRoot() {
+  if (typeof document === "undefined") return null;
+  ensureStyle();
+  let el = document.querySelector(`[${LABEL_ATTR}]`);
+  if (!el) {
+    el = document.createElement("div");
+    el.setAttribute(LABEL_ATTR, "");
+    el.className = "ui9000-label-tooltip";
+    document.body.appendChild(el);
+  }
+  return el;
+}
+function fillHover(el, content) {
+  el.replaceChildren();
+  if (content.title) {
+    const title = document.createElement("div");
+    title.className = "ui9000-chart-tooltip__title name";
+    title.textContent = content.title;
+    el.appendChild(title);
+  }
+  if (!content.rows.length) return;
+  const rows = document.createElement("div");
+  rows.className = "ui9000-chart-tooltip__rows";
+  for (const row of content.rows) {
+    const line = document.createElement("div");
+    line.className = "ui9000-chart-tooltip__row row";
+    if (row.label) {
+      const label = document.createElement("div");
+      label.className = "ui9000-chart-tooltip__label";
+      label.textContent = row.label;
+      line.appendChild(label);
+    }
+    const value = document.createElement("div");
+    value.className = "ui9000-chart-tooltip__value";
+    value.textContent = row.value;
+    line.appendChild(value);
+    rows.appendChild(line);
+  }
+  el.appendChild(rows);
+}
+function placeHover(el, event) {
+  const tooltipWidth = el.offsetWidth;
+  const tooltipHeight = el.offsetHeight;
+  const triangleHeight = 8;
+  const triangleWidth = 6;
+  const offsetX = 25;
+  const offsetY = triangleHeight;
+  const edge = 5;
+  const { pageX, pageY, clientX, clientY } = event;
+  let newX = pageX - offsetX;
+  let newY = pageY - tooltipHeight - offsetY;
+  let atEdge = false;
+  let triangleLeft = offsetX;
+  let triangleTop = "100%";
+  let side = "bottom";
+  const viewportWidth = window.innerWidth || tooltipWidth;
+  if (clientX + tooltipWidth + edge >= viewportWidth) {
+    newX = viewportWidth - tooltipWidth - edge - offsetX;
+    atEdge = true;
+  } else if (clientX - offsetX <= edge) {
+    newX = edge;
+    atEdge = true;
+  }
+  if (tooltipHeight + triangleHeight + edge >= clientY) {
+    newY = pageY + triangleHeight;
+    triangleTop = `${-triangleHeight}px`;
+    side = "top";
+  }
+  if (atEdge && tooltipWidth > 0) {
+    triangleLeft = Math.min(
+      Math.max(clientX - newX, edge + triangleWidth / 2),
+      tooltipWidth - edge - triangleWidth / 2
+    );
+  }
+  el.style.left = `${newX}px`;
+  el.style.top = `${newY}px`;
+  el.style.setProperty("--ui9000-tip-left", `${triangleLeft}px`);
+  el.style.setProperty("--ui9000-tip-top", triangleTop);
+  el.dataset.side = side;
+}
+function presentChartTooltip(owner, event, content) {
+  const el = hoverRoot();
+  if (!el) return;
+  const opening = hoverOwner !== owner || !el.classList.contains("is-open");
+  hoverOwner = owner;
+  fillHover(el, content);
+  el.classList.add("is-open");
+  placeHover(el, event);
+  if (opening) {
+    el.classList.remove("is-open");
+    void el.offsetWidth;
+    el.classList.add("is-open");
+  }
+}
+function dismissChartTooltip(owner) {
+  var _a;
+  if (hoverOwner !== owner) return;
+  hoverOwner = null;
+  (_a = hoverRoot()) == null ? void 0 : _a.classList.remove("is-open");
+}
+function presentLabelTooltip(owner, event, text) {
+  const el = labelRoot();
+  if (!el) return;
+  labelOwner = owner;
+  el.textContent = text;
+  el.style.left = `${event.pageX}px`;
+  el.style.top = `${event.pageY - 25}px`;
+  el.classList.add("is-open");
+}
+function dismissLabelTooltip(owner) {
+  var _a;
+  if (labelOwner !== owner) return;
+  labelOwner = null;
+  (_a = labelRoot()) == null ? void 0 : _a.classList.remove("is-open");
+}
+function dismissTooltips(owner) {
+  dismissChartTooltip(owner);
+  dismissLabelTooltip(owner);
+}
+export {
+  dismissChartTooltip,
+  dismissLabelTooltip,
+  dismissTooltips,
+  presentChartTooltip,
+  presentLabelTooltip
+};
+//# sourceMappingURL=chart-tooltip-portal.js.map

package/dist/element/chart-tooltip-portal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart-tooltip-portal.js","sources":["../../src/element/chart-tooltip-portal.ts"],"sourcesContent":["/**\n * Chart hover tooltip and axis-label tooltip, ported from the client.\n * Both are mounted on document.body so dashboard overflow does not clip them.\n *\n * Hover card matches `@fuselab-creative/design-system` Tooltip plus the\n * label/value rows from the client TooltipContent.\n * Axis-label chip matches `Widgets/components/LabelTooltip`.\n */\n\nexport type ChartTooltipRow = { label: string; value: string };\n\nexport type ChartTooltipContent = {\n  title?: string;\n  rows: ChartTooltipRow[];\n};\n\ntype PointerEventLike = {\n  pageX: number;\n  pageY: number;\n  clientX: number;\n  clientY: number;\n};\n\nconst HOVER_ATTR = 'data-ui9000-chart-tooltip';\nconst LABEL_ATTR = 'data-ui9000-label-tooltip';\nconst STYLE_ID = 'ui9000-chart-tooltip-style';\n\nlet hoverOwner: HTMLElement | null = null;\nlet labelOwner: HTMLElement | null = null;\n\nconst TOOLTIP_CSS = `\n.ui9000-chart-tooltip {\n  position: absolute;\n  z-index: 1000;\n  display: none;\n  flex-direction: column;\n  gap: 8px;\n  box-sizing: border-box;\n  min-width: 110px;\n  padding: 8px 12px;\n  border: 1px solid var(--colors-neutral-border-weakest, #dfe1e4);\n  border-radius: 6px;\n  background: var(--colors-neutral-background-base, #fff);\n  color: var(--colors-neutral-text-default, #444547);\n  box-shadow:\n    0 2px 4px 0 rgba(20, 28, 44, 0.06),\n    0 4px 8px 2px rgba(20, 28, 44, 0.06);\n  pointer-events: none;\n  font-family: var(--ui9000-font-family, system-ui, sans-serif);\n  opacity: 0;\n  scale: 0.8;\n}\n.ui9000-chart-tooltip.is-open {\n  display: flex;\n  animation: ui9000-tooltip-in 0.2s forwards;\n}\n@keyframes ui9000-tooltip-in {\n  to { opacity: 1; scale: 1; }\n}\n.ui9000-chart-tooltip__title {\n  margin: 0;\n  font-size: 14px;\n  font-weight: 500;\n  line-height: 16px;\n  text-align: left;\n}\n.ui9000-chart-tooltip__rows {\n  display: flex;\n  flex-direction: column;\n  min-width: 110px;\n}\n.ui9000-chart-tooltip__row {\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n  flex-direction: row;\n  gap: 8px;\n  border-bottom: 1px dashed var(--colors-neutral-border-weakest, #dfe1e4);\n}\n.ui9000-chart-tooltip__row:last-child {\n  border: none;\n}\n.ui9000-chart-tooltip__label {\n  font-size: 12px;\n  line-height: 14px;\n  font-weight: 400;\n  margin: 2px 0;\n  min-width: 60px;\n  max-width: 120px;\n  max-height: 2lh;\n  overflow: hidden;\n  word-wrap: break-all;\n  text-overflow: ellipsis;\n  opacity: 0.6;\n}\n.ui9000-chart-tooltip__value {\n  font-size: 12px;\n  line-height: 14px;\n  font-weight: 500;\n  margin: 2px 0;\n  width: max-content;\n}\n.ui9000-chart-tooltip::after,\n.ui9000-chart-tooltip::before {\n  content: \"\";\n  position: absolute;\n  top: var(--ui9000-tip-top, 100%);\n  left: var(--ui9000-tip-left, 25px);\n  width: 0;\n  height: 0;\n  translate: -50%;\n}\n.ui9000-chart-tooltip[data-side='bottom']::after {\n  border-right: 5px solid transparent;\n  border-top: 8px solid var(--colors-neutral-background-base, #fff);\n  border-left: 5px solid transparent;\n}\n.ui9000-chart-tooltip[data-side='top']::after {\n  border-right: 5px solid transparent;\n  border-bottom: 8px solid var(--colors-neutral-background-base, #fff);\n  border-left: 5px solid transparent;\n}\n.ui9000-chart-tooltip[data-side='bottom']::before {\n  opacity: 0.1;\n  border-right: 7px solid transparent;\n  border-top: 8px solid #000;\n  border-left: 7px solid transparent;\n}\n.ui9000-chart-tooltip[data-side='top']::before {\n  opacity: 0.1;\n  border-right: 7px solid transparent;\n  border-bottom: 8px solid #000;\n  border-left: 7px solid transparent;\n}\n.ui9000-label-tooltip {\n  position: absolute;\n  z-index: 100;\n  display: none;\n  box-sizing: border-box;\n  padding: 2px 5px;\n  border: 1px solid var(--colors-neutral-border-weakest, #dfe1e4);\n  border-radius: 5px;\n  background: var(--colors-neutral-background-base, #fff);\n  color: var(--colors-neutral-text-weak, #6c7584);\n  font-family: var(--ui9000-font-family, system-ui, sans-serif);\n  font-size: 11px;\n  font-weight: 400;\n  line-height: 1.35;\n  pointer-events: none;\n  white-space: nowrap;\n}\n.ui9000-label-tooltip.is-open {\n  display: block;\n}\n`;\n\nfunction ensureStyle(): void {\n  if (typeof document === 'undefined') return;\n  if (document.getElementById(STYLE_ID)) return;\n  const style = document.createElement('style');\n  style.id = STYLE_ID;\n  style.textContent = TOOLTIP_CSS;\n  document.head.appendChild(style);\n}\n\nfunction hoverRoot(): HTMLDivElement | null {\n  if (typeof document === 'undefined') return null;\n  ensureStyle();\n  let el = document.querySelector(`[${HOVER_ATTR}]`) as HTMLDivElement | null;\n  if (!el) {\n    el = document.createElement('div');\n    el.setAttribute(HOVER_ATTR, '');\n    el.className = 'ui9000-chart-tooltip';\n    el.dataset.side = 'bottom';\n    document.body.appendChild(el);\n  }\n  return el;\n}\n\nfunction labelRoot(): HTMLDivElement | null {\n  if (typeof document === 'undefined') return null;\n  ensureStyle();\n  let el = document.querySelector(`[${LABEL_ATTR}]`) as HTMLDivElement | null;\n  if (!el) {\n    el = document.createElement('div');\n    el.setAttribute(LABEL_ATTR, '');\n    el.className = 'ui9000-label-tooltip';\n    document.body.appendChild(el);\n  }\n  return el;\n}\n\nfunction fillHover(el: HTMLDivElement, content: ChartTooltipContent): void {\n  el.replaceChildren();\n  if (content.title) {\n    const title = document.createElement('div');\n    title.className = 'ui9000-chart-tooltip__title name';\n    title.textContent = content.title;\n    el.appendChild(title);\n  }\n  if (!content.rows.length) return;\n  const rows = document.createElement('div');\n  rows.className = 'ui9000-chart-tooltip__rows';\n  for (const row of content.rows) {\n    const line = document.createElement('div');\n    line.className = 'ui9000-chart-tooltip__row row';\n    if (row.label) {\n      const label = document.createElement('div');\n      label.className = 'ui9000-chart-tooltip__label';\n      label.textContent = row.label;\n      line.appendChild(label);\n    }\n    const value = document.createElement('div');\n    value.className = 'ui9000-chart-tooltip__value';\n    value.textContent = row.value;\n    line.appendChild(value);\n    rows.appendChild(line);\n  }\n  el.appendChild(rows);\n}\n\nfunction placeHover(el: HTMLDivElement, event: PointerEventLike): void {\n  const tooltipWidth = el.offsetWidth;\n  const tooltipHeight = el.offsetHeight;\n  const triangleHeight = 8;\n  const triangleWidth = 6;\n  const offsetX = 25;\n  const offsetY = triangleHeight;\n  const edge = 5;\n  const { pageX, pageY, clientX, clientY } = event;\n\n  let newX = pageX - offsetX;\n  let newY = pageY - tooltipHeight - offsetY;\n  let atEdge = false;\n  let triangleLeft = offsetX;\n  let triangleTop = '100%';\n  let side: 'top' | 'bottom' = 'bottom';\n\n  const viewportWidth = window.innerWidth || tooltipWidth;\n  if (clientX + tooltipWidth + edge >= viewportWidth) {\n    newX = viewportWidth - tooltipWidth - edge - offsetX;\n    atEdge = true;\n  } else if (clientX - offsetX <= edge) {\n    newX = edge;\n    atEdge = true;\n  }\n\n  if (tooltipHeight + triangleHeight + edge >= clientY) {\n    newY = pageY + triangleHeight;\n    triangleTop = `${-triangleHeight}px`;\n    side = 'top';\n  }\n\n  if (atEdge && tooltipWidth > 0) {\n    triangleLeft = Math.min(\n      Math.max(clientX - newX, edge + triangleWidth / 2),\n      tooltipWidth - edge - triangleWidth / 2,\n    );\n  }\n\n  el.style.left = `${newX}px`;\n  el.style.top = `${newY}px`;\n  el.style.setProperty('--ui9000-tip-left', `${triangleLeft}px`);\n  el.style.setProperty('--ui9000-tip-top', triangleTop);\n  el.dataset.side = side;\n}\n\nexport function presentChartTooltip(\n  owner: HTMLElement,\n  event: PointerEventLike,\n  content: ChartTooltipContent,\n): void {\n  const el = hoverRoot();\n  if (!el) return;\n  const opening = hoverOwner !== owner || !el.classList.contains('is-open');\n  hoverOwner = owner;\n  fillHover(el, content);\n  el.classList.add('is-open');\n  placeHover(el, event);\n  if (opening) {\n    el.classList.remove('is-open');\n    void el.offsetWidth;\n    el.classList.add('is-open');\n  }\n}\n\nexport function dismissChartTooltip(owner: HTMLElement): void {\n  if (hoverOwner !== owner) return;\n  hoverOwner = null;\n  hoverRoot()?.classList.remove('is-open');\n}\n\nexport function presentLabelTooltip(\n  owner: HTMLElement,\n  event: PointerEventLike,\n  text: string,\n): void {\n  const el = labelRoot();\n  if (!el) return;\n  labelOwner = owner;\n  el.textContent = text;\n  el.style.left = `${event.pageX}px`;\n  el.style.top = `${event.pageY - 25}px`;\n  el.classList.add('is-open');\n}\n\nexport function dismissLabelTooltip(owner: HTMLElement): void {\n  if (labelOwner !== owner) return;\n  labelOwner = null;\n  labelRoot()?.classList.remove('is-open');\n}\n\nexport function dismissTooltips(owner: HTMLElement): void {\n  dismissChartTooltip(owner);\n  dismissLabelTooltip(owner);\n}\n"],"names":[],"mappings":"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"}

package/dist/element/header-icons.d.ts

@@ -0,0 +1,18 @@
+import { SVGTemplateResult } from 'lit';
+/** Carbon OverflowMenuHorizontal, rendered at 16. */
+export declare const iconOverflow: SVGTemplateResult;
+/** Carbon Download, 16px glyph. */
+export declare const iconDownload: SVGTemplateResult;
+/** Carbon TrashCan, rendered at 16. */
+export declare const iconRemove: SVGTemplateResult;
+/** Carbon SettingsAdjust, rendered at 16. */
+export declare const iconSettings: SVGTemplateResult;
+/** Client `ai-filled.svg`. Keeps its own fill; the button color must not recolor it. */
+export declare const iconChat: import('lit-html').TemplateResult<2>;
+/** Client `tableIcon.svg`. */
+export declare const iconTable: SVGTemplateResult;
+/** Client `FeedBackIcon.svg`. */
+export declare const iconFeedback: SVGTemplateResult;
+/** Client `report-icon.svg` (Add to page). */
+export declare const iconPage: SVGTemplateResult;
+//# sourceMappingURL=header-icons.d.ts.map

package/dist/element/header-icons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"header-icons.d.ts","sourceRoot":"","sources":["../../src/element/header-icons.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,iBAAiB,EAAE,MAAM,KAAK,CAAC;AAclD,qDAAqD;AACrD,eAAO,MAAM,YAAY,mBAGxB,CAAC;AAEF,mCAAmC;AACnC,eAAO,MAAM,YAAY,mBAGxB,CAAC;AAEF,uCAAuC;AACvC,eAAO,MAAM,UAAU,mBAGtB,CAAC;AAEF,6CAA6C;AAC7C,eAAO,MAAM,YAAY,mBAGxB,CAAC;AAEF,wFAAwF;AACxF,eAAO,MAAM,QAAQ,sCAA+7B,CAAC;AAEr9B,8BAA8B;AAC9B,eAAO,MAAM,SAAS,mBAGrB,CAAC;AAEF,iCAAiC;AACjC,eAAO,MAAM,YAAY,mBAGxB,CAAC;AAEF,8CAA8C;AAC9C,eAAO,MAAM,QAAQ,mBAGpB,CAAC"}

package/dist/element/header-icons.js

@@ -0,0 +1,44 @@
+import { svg } from "lit";
+function glyph(viewBox, paths) {
+  return svg`<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="${viewBox}" fill="currentColor" aria-hidden="true">${paths}</svg>`;
+}
+const iconOverflow = glyph(
+  "0 0 32 32",
+  svg`<circle cx="8" cy="16" r="2"></circle><circle cx="16" cy="16" r="2"></circle><circle cx="24" cy="16" r="2"></circle>`
+);
+const iconDownload = glyph(
+  "0 0 16 16",
+  svg`<path d="M13 7 12.3 6.3 8.5 10.1 8.5 1 7.5 1 7.5 10.1 3.7 6.3 3 7 8 12z"></path><path d="M13,12v2H3v-2H2v2l0,0c0,0.6,0.4,1,1,1h10c0.6,0,1-0.4,1-1l0,0v-2H13z"></path>`
+);
+const iconRemove = glyph(
+  "0 0 32 32",
+  svg`<path d="M12 12H14V24H12z"></path><path d="M18 12H20V24H18z"></path><path d="M4,6V8H6V28a2,2,0,0,0,2,2H24a2,2,0,0,0,2-2V8h2V6ZM8,28V8H24V28Z"></path><path d="M12 2H20V4H12z"></path>`
+);
+const iconSettings = glyph(
+  "0 0 32 32",
+  svg`<path d="M30,8h-4.1c-0.5-2.3-2.5-4-4.9-4s-4.4,1.7-4.9,4H2v2h14.1c0.5,2.3,2.5,4,4.9,4s4.4-1.7,4.9-4H30V8z M21,12c-1.7,0-3-1.3-3-3 s1.3-3,3-3s3,1.3,3,3S22.7,12,21,12z"></path><path d="M2,24h4.1c0.5,2.3,2.5,4,4.9,4s4.4-1.7,4.9-4H30v-2H15.9c-0.5-2.3-2.5-4-4.9-4s-4.4,1.7-4.9,4H2V24z M11,20c1.7,0,3,1.3,3,3 s-1.3,3-3,3s-3-1.3-3-3S9.3,20,11,20z"></path>`
+);
+const iconChat = svg`<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><path fill="var(--colors-primary-icon-weaker, #9ea1fa)" fill-rule="evenodd" d="M.867 6.18a7.3 7.3 0 0 1 .76-1.86 7.36 7.36 0 0 1 9.221-3.105 2.9 2.9 0 0 1 1.278 1.605 2.92 2.92 0 0 1-.18 2.243l-.044.082-.007.011-.075.127-.002.004-.1.171-7.992-.05h-.175a3.57 3.57 0 0 0-2.83 1.498 7 7 0 0 1 .146-.726m.584.836A2.92 2.92 0 0 0 .7 8.939a7.36 7.36 0 0 0 9.992 5.913 3.55 3.55 0 0 1-1.634-.58 3.6 3.6 0 0 1-1.085-1.133l-.007-.012-.076-.134-3.948-6.939-.001.002-.205-.007h-.027l-.132-.001h-.03a2.94 2.94 0 0 0-2.096.968m6.89 5.476.004.006h.007l.09.17.005.009.006.012q.03.056.063.11l.005.009.002.003.006.01a2.94 2.94 0 0 0 2.308 1.4q.098.007.194.007c.521 0 1.009-.137 1.432-.375a7.362 7.362 0 0 0 .123-11.611c.251.548.352 1.134.316 1.705-.032.49-.163.97-.387 1.407l.004.003-.065.111-.075.127-.015.027-.28.478z" clip-rule="evenodd"></path></svg>`;
+const iconTable = glyph(
+  "0 0 16 16",
+  svg`<path d="M13.5 1.5h-11a1 1 0 0 0-1 1v11a1 1 0 0 0 1 1h11a1 1 0 0 0 1-1v-11a1 1 0 0 0-1-1m0 1v2h-11v-2zm-5 3h5V9h-5zM7.5 9h-5V5.5h5zm-5 1h5v3.5h-5zm6 3.5V10h5v3.5z"></path>`
+);
+const iconFeedback = glyph(
+  "0 0 16 16",
+  svg`<path fill-rule="evenodd" d="M8 6.48c0 .699-.306 1.348-.814 1.812A2.75 2.75 0 0 1 5.334 9H0V4.418l1.369-1.874L1.767 0h1.566c.326 0 .655.118.91.35.259.237.423.577.424.953V2.74h1.667a1.7 1.7 0 0 1 1.145.44c.32.293.52.71.521 1.167zM3.667 3.74V1.303a.3.3 0 0 0-.098-.215A.35.35 0 0 0 3.333 1h-.71l-.304 1.938L1 4.744V8h4.333c.442 0 .866-.16 1.178-.446A1.46 1.46 0 0 0 7 6.478v-2.13a.58.58 0 0 0-.196-.43.7.7 0 0 0-.47-.179H3.666zM8 9.52c0-.699.306-1.348.814-1.812A2.75 2.75 0 0 1 10.666 7H16v4.582l-1.369 1.874L14.233 16h-1.566c-.326 0-.655-.118-.91-.35a1.3 1.3 0 0 1-.424-.954v-1.435H9.666a1.7 1.7 0 0 1-1.145-.44c-.32-.293-.52-.71-.521-1.168zm4.333 2.74v2.436c0 .08.035.158.098.215a.35.35 0 0 0 .236.089h.71l.304-1.938L15 11.256V8h-4.333c-.442 0-.866.16-1.178.446A1.46 1.46 0 0 0 9 9.522v2.13c0 .162.07.316.196.43a.7.7 0 0 0 .47.179h2.667z" clip-rule="evenodd"></path>`
+);
+const iconPage = glyph(
+  "0 0 16 16",
+  svg`<path d="M9 9H5v1h4zM11 6.5H5v1h6zM7.5 11.5H5v1h2.5z"></path><path d="M12.5 2.5H11V2a1 1 0 0 0-1-1H6a1 1 0 0 0-1 1v.5H3.5a1 1 0 0 0-1 1V14a1 1 0 0 0 1 1h9a1 1 0 0 0 1-1V3.5a1 1 0 0 0-1-1M6 2h4v2H6zm6.5 12h-9V3.5H5V5h6V3.5h1.5z"></path>`
+);
+export {
+  iconChat,
+  iconDownload,
+  iconFeedback,
+  iconOverflow,
+  iconPage,
+  iconRemove,
+  iconSettings,
+  iconTable
+};
+//# sourceMappingURL=header-icons.js.map

package/dist/element/header-icons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"header-icons.js","sources":["../../src/element/header-icons.ts"],"sourcesContent":["import { svg, type SVGTemplateResult } from 'lit';\n\n/**\n * Header icons from the FuseDash widget menu.\n * Overflow, download, remove, and settings are Carbon icons at 16px\n * (Apache-2.0). Chat, table, feedback, and add-to-page are the same SVGs\n * the client menu renders next to those Carbon icons.\n * Clip paths from the source files are the 16×16 viewBox, so they are omitted.\n */\n\nfunction glyph(viewBox: string, paths: SVGTemplateResult): SVGTemplateResult {\n  return svg`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"${viewBox}\" fill=\"currentColor\" aria-hidden=\"true\">${paths}</svg>`;\n}\n\n/** Carbon OverflowMenuHorizontal, rendered at 16. */\nexport const iconOverflow = glyph(\n  '0 0 32 32',\n  svg`<circle cx=\"8\" cy=\"16\" r=\"2\"></circle><circle cx=\"16\" cy=\"16\" r=\"2\"></circle><circle cx=\"24\" cy=\"16\" r=\"2\"></circle>`,\n);\n\n/** Carbon Download, 16px glyph. */\nexport const iconDownload = glyph(\n  '0 0 16 16',\n  svg`<path d=\"M13 7 12.3 6.3 8.5 10.1 8.5 1 7.5 1 7.5 10.1 3.7 6.3 3 7 8 12z\"></path><path d=\"M13,12v2H3v-2H2v2l0,0c0,0.6,0.4,1,1,1h10c0.6,0,1-0.4,1-1l0,0v-2H13z\"></path>`,\n);\n\n/** Carbon TrashCan, rendered at 16. */\nexport const iconRemove = glyph(\n  '0 0 32 32',\n  svg`<path d=\"M12 12H14V24H12z\"></path><path d=\"M18 12H20V24H18z\"></path><path d=\"M4,6V8H6V28a2,2,0,0,0,2,2H24a2,2,0,0,0,2-2V8h2V6ZM8,28V8H24V28Z\"></path><path d=\"M12 2H20V4H12z\"></path>`,\n);\n\n/** Carbon SettingsAdjust, rendered at 16. */\nexport const iconSettings = glyph(\n  '0 0 32 32',\n  svg`<path d=\"M30,8h-4.1c-0.5-2.3-2.5-4-4.9-4s-4.4,1.7-4.9,4H2v2h14.1c0.5,2.3,2.5,4,4.9,4s4.4-1.7,4.9-4H30V8z M21,12c-1.7,0-3-1.3-3-3 s1.3-3,3-3s3,1.3,3,3S22.7,12,21,12z\"></path><path d=\"M2,24h4.1c0.5,2.3,2.5,4,4.9,4s4.4-1.7,4.9-4H30v-2H15.9c-0.5-2.3-2.5-4-4.9-4s-4.4,1.7-4.9,4H2V24z M11,20c1.7,0,3,1.3,3,3 s-1.3,3-3,3s-3-1.3-3-3S9.3,20,11,20z\"></path>`,\n);\n\n/** Client `ai-filled.svg`. Keeps its own fill; the button color must not recolor it. */\nexport const iconChat = svg`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" aria-hidden=\"true\"><path fill=\"var(--colors-primary-icon-weaker, #9ea1fa)\" fill-rule=\"evenodd\" d=\"M.867 6.18a7.3 7.3 0 0 1 .76-1.86 7.36 7.36 0 0 1 9.221-3.105 2.9 2.9 0 0 1 1.278 1.605 2.92 2.92 0 0 1-.18 2.243l-.044.082-.007.011-.075.127-.002.004-.1.171-7.992-.05h-.175a3.57 3.57 0 0 0-2.83 1.498 7 7 0 0 1 .146-.726m.584.836A2.92 2.92 0 0 0 .7 8.939a7.36 7.36 0 0 0 9.992 5.913 3.55 3.55 0 0 1-1.634-.58 3.6 3.6 0 0 1-1.085-1.133l-.007-.012-.076-.134-3.948-6.939-.001.002-.205-.007h-.027l-.132-.001h-.03a2.94 2.94 0 0 0-2.096.968m6.89 5.476.004.006h.007l.09.17.005.009.006.012q.03.056.063.11l.005.009.002.003.006.01a2.94 2.94 0 0 0 2.308 1.4q.098.007.194.007c.521 0 1.009-.137 1.432-.375a7.362 7.362 0 0 0 .123-11.611c.251.548.352 1.134.316 1.705-.032.49-.163.97-.387 1.407l.004.003-.065.111-.075.127-.015.027-.28.478z\" clip-rule=\"evenodd\"></path></svg>`;\n\n/** Client `tableIcon.svg`. */\nexport const iconTable = glyph(\n  '0 0 16 16',\n  svg`<path d=\"M13.5 1.5h-11a1 1 0 0 0-1 1v11a1 1 0 0 0 1 1h11a1 1 0 0 0 1-1v-11a1 1 0 0 0-1-1m0 1v2h-11v-2zm-5 3h5V9h-5zM7.5 9h-5V5.5h5zm-5 1h5v3.5h-5zm6 3.5V10h5v3.5z\"></path>`,\n);\n\n/** Client `FeedBackIcon.svg`. */\nexport const iconFeedback = glyph(\n  '0 0 16 16',\n  svg`<path fill-rule=\"evenodd\" d=\"M8 6.48c0 .699-.306 1.348-.814 1.812A2.75 2.75 0 0 1 5.334 9H0V4.418l1.369-1.874L1.767 0h1.566c.326 0 .655.118.91.35.259.237.423.577.424.953V2.74h1.667a1.7 1.7 0 0 1 1.145.44c.32.293.52.71.521 1.167zM3.667 3.74V1.303a.3.3 0 0 0-.098-.215A.35.35 0 0 0 3.333 1h-.71l-.304 1.938L1 4.744V8h4.333c.442 0 .866-.16 1.178-.446A1.46 1.46 0 0 0 7 6.478v-2.13a.58.58 0 0 0-.196-.43.7.7 0 0 0-.47-.179H3.666zM8 9.52c0-.699.306-1.348.814-1.812A2.75 2.75 0 0 1 10.666 7H16v4.582l-1.369 1.874L14.233 16h-1.566c-.326 0-.655-.118-.91-.35a1.3 1.3 0 0 1-.424-.954v-1.435H9.666a1.7 1.7 0 0 1-1.145-.44c-.32-.293-.52-.71-.521-1.168zm4.333 2.74v2.436c0 .08.035.158.098.215a.35.35 0 0 0 .236.089h.71l.304-1.938L15 11.256V8h-4.333c-.442 0-.866.16-1.178.446A1.46 1.46 0 0 0 9 9.522v2.13c0 .162.07.316.196.43a.7.7 0 0 0 .47.179h2.667z\" clip-rule=\"evenodd\"></path>`,\n);\n\n/** Client `report-icon.svg` (Add to page). */\nexport const iconPage = glyph(\n  '0 0 16 16',\n  svg`<path d=\"M9 9H5v1h4zM11 6.5H5v1h6zM7.5 11.5H5v1h2.5z\"></path><path d=\"M12.5 2.5H11V2a1 1 0 0 0-1-1H6a1 1 0 0 0-1 1v.5H3.5a1 1 0 0 0-1 1V14a1 1 0 0 0 1 1h9a1 1 0 0 0 1-1V3.5a1 1 0 0 0-1-1M6 2h4v2H6zm6.5 12h-9V3.5H5V5h6V3.5h1.5z\"></path>`,\n);\n"],"names":[],"mappings":";AAUA,SAAS,MAAM,SAAiB,OAA6C;AAC3E,SAAO,8EAA8E,OAAO,4CAA4C,KAAK;AAC/I;AAGO,MAAM,eAAe;AAAA,EAC1B;AAAA,EACA;AACF;AAGO,MAAM,eAAe;AAAA,EAC1B;AAAA,EACA;AACF;AAGO,MAAM,aAAa;AAAA,EACxB;AAAA,EACA;AACF;AAGO,MAAM,eAAe;AAAA,EAC1B;AAAA,EACA;AACF;AAGO,MAAM,WAAW;AAGjB,MAAM,YAAY;AAAA,EACvB;AAAA,EACA;AACF;AAGO,MAAM,eAAe;AAAA,EAC1B;AAAA,EACA;AACF;AAGO,MAAM,WAAW;AAAA,EACtB;AAAA,EACA;AACF;"}

package/dist/element/ui9000-chart-base.d.ts

@@ -1,6 +1,8 @@
 import { LitElement, nothing } from 'lit';
+import { ChartTooltipContent } from './chart-tooltip-portal.js';
 import { chartShellStyles } from './chart-shell-styles.js';
 import { LabelTooltipState } from '../utils/chart-shell.js';
+import { WidgetHeaderHandlers, WidgetHeaderVariant } from './widget-header.js';
 /** Shared widget chrome: header, axis-label tooltip, menu. */
 export declare abstract class Ui9000ChartElement extends LitElement {
     dataJson: string;
@@ -11,11 +13,28 @@ export declare abstract class Ui9000ChartElement extends LitElement {
      * chart inside their own chrome could not suppress the header.
      */
     showHeader: boolean;
+    /**
+     * `chat` (default): title + download menu, always visible.
+     * `dash`: dashboard chrome — chat, overflow actions, settings — shown only
+     * when the matching handler is set. Chat and overflow appear on hover.
+     */
+    headerVariant: WidgetHeaderVariant;
+    /**
+     * Host callbacks. Not a Lit property, so assigning them re-renders the
+     * header without redrawing the plot.
+     */
+    private _headerHandlers;
+    get headerHandlers(): WidgetHeaderHandlers;
+    set headerHandlers(value: WidgetHeaderHandlers);
     protected _labelTooltip: LabelTooltipState;
     protected _menuOpen: boolean;
     protected _onDocClick: () => void;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    /** Hover card on document.body. Matches the client chart tooltip. */
+    protected openTooltip(event: MouseEvent, content: ChartTooltipContent): void;
+    protected closeTooltip(): void;
+    protected closeAllTooltips(): void;
     protected headerTitle(): string;
     protected axisLabelHandlers(): import('../utils/axis-labels.js').AxisLabelTooltipHandlers;
     protected renderShellHeader(title: string): import('lit-html').TemplateResult | typeof nothing;

package/dist/element/ui9000-chart-base.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ui9000-chart-base.d.ts","sourceRoot":"","sources":["../../src/element/ui9000-chart-base.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAG1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAM3D,OAAO,EAGL,KAAK,iBAAiB,EACvB,MAAM,yBAAyB,CAAC;AAEjC,8DAA8D;AAC9D,8BAAsB,kBAAmB,SAAQ,UAAU;IAEzD,QAAQ,SAAQ;IAGhB,UAAU,SAAM;IAEhB;;;;OAIG;IAQH,UAAU,UAAQ;IAGlB,SAAS,CAAC,aAAa,EAAE,iBAAiB,CAAQ;IAGlD,SAAS,CAAC,SAAS,UAAS;IAE5B,SAAS,CAAC,WAAW,QAAO,IAAI,CAE9B;IAEO,iBAAiB,IAAI,IAAI;IAKzB,oBAAoB,IAAI,IAAI;IAKrC,SAAS,CAAC,WAAW,IAAI,MAAM;IAI/B,SAAS,CAAC,iBAAiB;IAM3B,SAAS,CAAC,iBAAiB,CAAC,KAAK,EAAE,MAAM;IAgBzC,SAAS,CAAC,uBAAuB;CAGlC;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAC"}
+{"version":3,"file":"ui9000-chart-base.d.ts","sourceRoot":"","sources":["../../src/element/ui9000-chart-base.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAG1C,OAAO,EAIL,KAAK,mBAAmB,EACzB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAM3D,OAAO,EAGL,KAAK,iBAAiB,EACvB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAEL,KAAK,oBAAoB,EACzB,KAAK,mBAAmB,EACzB,MAAM,oBAAoB,CAAC;AAE5B,8DAA8D;AAC9D,8BAAsB,kBAAmB,SAAQ,UAAU;IAEzD,QAAQ,SAAQ;IAGhB,UAAU,SAAM;IAEhB;;;;OAIG;IAQH,UAAU,UAAQ;IAElB;;;;OAIG;IAOH,aAAa,EAAE,mBAAmB,CAAU;IAE5C;;;OAGG;IACH,OAAO,CAAC,eAAe,CAA4B;IAEnD,IAAI,cAAc,IAAI,oBAAoB,CAEzC;IAED,IAAI,cAAc,CAAC,KAAK,EAAE,oBAAoB,EAK7C;IAGD,SAAS,CAAC,aAAa,EAAE,iBAAiB,CAAQ;IAGlD,SAAS,CAAC,SAAS,UAAS;IAE5B,SAAS,CAAC,WAAW,QAAO,IAAI,CAE9B;IAEO,iBAAiB,IAAI,IAAI;IAKzB,oBAAoB,IAAI,IAAI;IAMrC,qEAAqE;IACrE,SAAS,CAAC,WAAW,CAAC,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,mBAAmB,GAAG,IAAI;IAI5E,SAAS,CAAC,YAAY,IAAI,IAAI;IAI9B,SAAS,CAAC,gBAAgB,IAAI,IAAI;IAIlC,SAAS,CAAC,WAAW,IAAI,MAAM;IAI/B,SAAS,CAAC,iBAAiB;IAM3B,SAAS,CAAC,iBAAiB,CAAC,KAAK,EAAE,MAAM;IAkBzC,SAAS,CAAC,uBAAuB;CAGlC;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAC"}

package/dist/element/ui9000-chart-base.js

@@ -1,7 +1,9 @@
 import { LitElement, nothing } from "lit";
 import { property, state } from "lit/decorators.js";
+import { dismissTooltips, presentChartTooltip, dismissChartTooltip } from "./chart-tooltip-portal.js";
 import { renderWidgetHeader, renderLabelTooltip, dispatchChartDownload } from "./chart-shell-render.js";
 import { resolveHeaderTitle, createAxisLabelHandlers } from "../utils/chart-shell.js";
+import { resolveHeaderVariant } from "./widget-header.js";
 var __defProp = Object.defineProperty;
 var __decorateClass = (decorators, target, key, kind) => {
   var result = void 0;
@@ -17,20 +19,42 @@ class Ui9000ChartElement extends LitElement {
     this.dataJson = "[]";
     this.chartTitle = "";
     this.showHeader = true;
+    this.headerVariant = "chat";
+    this._headerHandlers = {};
     this._labelTooltip = null;
     this._menuOpen = false;
     this._onDocClick = () => {
       this._menuOpen = false;
     };
   }
+  get headerHandlers() {
+    return this._headerHandlers;
+  }
+  set headerHandlers(value) {
+    const next = value ?? {};
+    if (next === this._headerHandlers) return;
+    this._headerHandlers = next;
+    this.requestUpdate();
+  }
   connectedCallback() {
     super.connectedCallback();
     document.addEventListener("click", this._onDocClick);
   }
   disconnectedCallback() {
     document.removeEventListener("click", this._onDocClick);
+    dismissTooltips(this);
     super.disconnectedCallback();
   }
+  /** Hover card on document.body. Matches the client chart tooltip. */
+  openTooltip(event, content) {
+    presentChartTooltip(this, event, content);
+  }
+  closeTooltip() {
+    dismissChartTooltip(this);
+  }
+  closeAllTooltips() {
+    dismissTooltips(this);
+  }
   headerTitle() {
     return resolveHeaderTitle(this.chartTitle, this.dataJson, this.showHeader);
   }
@@ -43,6 +67,8 @@ class Ui9000ChartElement extends LitElement {
     if (!title) return nothing;
     return renderWidgetHeader({
       title,
+      variant: this.headerVariant,
+      handlers: this._headerHandlers,
       menuOpen: this._menuOpen,
       onMenuToggle: (e) => {
         e.stopPropagation();
@@ -73,6 +99,14 @@ __decorateClass([
     attribute: "show-header"
   })
 ], Ui9000ChartElement.prototype, "showHeader");
+__decorateClass([
+  property({
+    attribute: "header-variant",
+    converter: {
+      fromAttribute: (value) => resolveHeaderVariant(value)
+    }
+  })
+], Ui9000ChartElement.prototype, "headerVariant");
 __decorateClass([
   state()
 ], Ui9000ChartElement.prototype, "_labelTooltip");

package/dist/element/ui9000-chart-base.js.map

@@ -1 +1 @@
-{"version":3,"file":"ui9000-chart-base.js","sources":["../../src/element/ui9000-chart-base.ts"],"sourcesContent":["import { LitElement, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\n\nimport { chartShellStyles } from './chart-shell-styles.js';\nimport {\n  dispatchChartDownload,\n  renderLabelTooltip,\n  renderWidgetHeader,\n} from './chart-shell-render.js';\nimport {\n  createAxisLabelHandlers,\n  resolveHeaderTitle,\n  type LabelTooltipState,\n} from '../utils/chart-shell.js';\n\n/** Shared widget chrome: header, axis-label tooltip, menu. */\nexport abstract class Ui9000ChartElement extends LitElement {\n  @property({ type: String, attribute: 'data' })\n  dataJson = '[]';\n\n  @property({ type: String, attribute: 'chart-title' })\n  chartTitle = '';\n\n  /**\n   * On by default; `show-header=\"false\"` turns it off. A plain `type: Boolean`\n   * property would read any present attribute as true, so hosts that embed a\n   * chart inside their own chrome could not suppress the header.\n   */\n  @property({\n    converter: {\n      fromAttribute: (value: string | null): boolean => value !== null && value !== 'false',\n      toAttribute: (value: boolean): string => (value ? '' : 'false'),\n    },\n    attribute: 'show-header',\n  })\n  showHeader = true;\n\n  @state()\n  protected _labelTooltip: LabelTooltipState = null;\n\n  @state()\n  protected _menuOpen = false;\n\n  protected _onDocClick = (): void => {\n    this._menuOpen = false;\n  };\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    document.addEventListener('click', this._onDocClick);\n  }\n\n  override disconnectedCallback(): void {\n    document.removeEventListener('click', this._onDocClick);\n    super.disconnectedCallback();\n  }\n\n  protected headerTitle(): string {\n    return resolveHeaderTitle(this.chartTitle, this.dataJson, this.showHeader);\n  }\n\n  protected axisLabelHandlers() {\n    return createAxisLabelHandlers(this, (t) => {\n      this._labelTooltip = t;\n    });\n  }\n\n  protected renderShellHeader(title: string) {\n    if (!title) return nothing;\n    return renderWidgetHeader({\n      title,\n      menuOpen: this._menuOpen,\n      onMenuToggle: (e: Event) => {\n        e.stopPropagation();\n        this._menuOpen = !this._menuOpen;\n      },\n      onMenuClose: () => {\n        this._menuOpen = false;\n      },\n      onDownload: () => dispatchChartDownload(this),\n    });\n  }\n\n  protected renderShellLabelTooltip() {\n    return renderLabelTooltip(this._labelTooltip);\n  }\n}\n\nexport { chartShellStyles };\n"],"names":[],"mappings":";;;;;;;;;;;;;AAgBO,MAAe,2BAA2B,WAAW;AAAA,EAArD,cAAA;AAAA,UAAA,GAAA,SAAA;AAEL,SAAA,WAAW;AAGX,SAAA,aAAa;AAcb,SAAA,aAAa;AAGb,SAAU,gBAAmC;AAG7C,SAAU,YAAY;AAEtB,SAAU,cAAc,MAAY;AAClC,WAAK,YAAY;AAAA,IACnB;AAAA,EAAA;AAAA,EAES,oBAA0B;AACjC,UAAM,kBAAA;AACN,aAAS,iBAAiB,SAAS,KAAK,WAAW;AAAA,EACrD;AAAA,EAES,uBAA6B;AACpC,aAAS,oBAAoB,SAAS,KAAK,WAAW;AACtD,UAAM,qBAAA;AAAA,EACR;AAAA,EAEU,cAAsB;AAC9B,WAAO,mBAAmB,KAAK,YAAY,KAAK,UAAU,KAAK,UAAU;AAAA,EAC3E;AAAA,EAEU,oBAAoB;AAC5B,WAAO,wBAAwB,MAAM,CAAC,MAAM;AAC1C,WAAK,gBAAgB;AAAA,IACvB,CAAC;AAAA,EACH;AAAA,EAEU,kBAAkB,OAAe;AACzC,QAAI,CAAC,MAAO,QAAO;AACnB,WAAO,mBAAmB;AAAA,MACxB;AAAA,MACA,UAAU,KAAK;AAAA,MACf,cAAc,CAAC,MAAa;AAC1B,UAAE,gBAAA;AACF,aAAK,YAAY,CAAC,KAAK;AAAA,MACzB;AAAA,MACA,aAAa,MAAM;AACjB,aAAK,YAAY;AAAA,MACnB;AAAA,MACA,YAAY,MAAM,sBAAsB,IAAI;AAAA,IAAA,CAC7C;AAAA,EACH;AAAA,EAEU,0BAA0B;AAClC,WAAO,mBAAmB,KAAK,aAAa;AAAA,EAC9C;AACF;AApEE,gBAAA;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,WAAW,QAAQ;AAAA,GADzB,mBAEpB,WAAA,UAAA;AAGA,gBAAA;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,WAAW,eAAe;AAAA,GAJhC,mBAKpB,WAAA,YAAA;AAcA,gBAAA;AAAA,EAPC,SAAS;AAAA,IACR,WAAW;AAAA,MACT,eAAe,CAAC,UAAkC,UAAU,QAAQ,UAAU;AAAA,MAC9E,aAAa,CAAC,UAA4B,QAAQ,KAAK;AAAA,IAAA;AAAA,IAEzD,WAAW;AAAA,EAAA,CACZ;AAAA,GAlBmB,mBAmBpB,WAAA,YAAA;AAGU,gBAAA;AAAA,EADT,MAAA;AAAM,GArBa,mBAsBV,WAAA,eAAA;AAGA,gBAAA;AAAA,EADT,MAAA;AAAM,GAxBa,mBAyBV,WAAA,WAAA;"}
+{"version":3,"file":"ui9000-chart-base.js","sources":["../../src/element/ui9000-chart-base.ts"],"sourcesContent":["import { LitElement, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\n\nimport {\n  dismissChartTooltip,\n  dismissTooltips,\n  presentChartTooltip,\n  type ChartTooltipContent,\n} from './chart-tooltip-portal.js';\nimport { chartShellStyles } from './chart-shell-styles.js';\nimport {\n  dispatchChartDownload,\n  renderLabelTooltip,\n  renderWidgetHeader,\n} from './chart-shell-render.js';\nimport {\n  createAxisLabelHandlers,\n  resolveHeaderTitle,\n  type LabelTooltipState,\n} from '../utils/chart-shell.js';\nimport {\n  resolveHeaderVariant,\n  type WidgetHeaderHandlers,\n  type WidgetHeaderVariant,\n} from './widget-header.js';\n\n/** Shared widget chrome: header, axis-label tooltip, menu. */\nexport abstract class Ui9000ChartElement extends LitElement {\n  @property({ type: String, attribute: 'data' })\n  dataJson = '[]';\n\n  @property({ type: String, attribute: 'chart-title' })\n  chartTitle = '';\n\n  /**\n   * On by default; `show-header=\"false\"` turns it off. A plain `type: Boolean`\n   * property would read any present attribute as true, so hosts that embed a\n   * chart inside their own chrome could not suppress the header.\n   */\n  @property({\n    converter: {\n      fromAttribute: (value: string | null): boolean => value !== null && value !== 'false',\n      toAttribute: (value: boolean): string => (value ? '' : 'false'),\n    },\n    attribute: 'show-header',\n  })\n  showHeader = true;\n\n  /**\n   * `chat` (default): title + download menu, always visible.\n   * `dash`: dashboard chrome — chat, overflow actions, settings — shown only\n   * when the matching handler is set. Chat and overflow appear on hover.\n   */\n  @property({\n    attribute: 'header-variant',\n    converter: {\n      fromAttribute: (value: string | null): WidgetHeaderVariant => resolveHeaderVariant(value),\n    },\n  })\n  headerVariant: WidgetHeaderVariant = 'chat';\n\n  /**\n   * Host callbacks. Not a Lit property, so assigning them re-renders the\n   * header without redrawing the plot.\n   */\n  private _headerHandlers: WidgetHeaderHandlers = {};\n\n  get headerHandlers(): WidgetHeaderHandlers {\n    return this._headerHandlers;\n  }\n\n  set headerHandlers(value: WidgetHeaderHandlers) {\n    const next = value ?? {};\n    if (next === this._headerHandlers) return;\n    this._headerHandlers = next;\n    this.requestUpdate();\n  }\n\n  @state()\n  protected _labelTooltip: LabelTooltipState = null;\n\n  @state()\n  protected _menuOpen = false;\n\n  protected _onDocClick = (): void => {\n    this._menuOpen = false;\n  };\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    document.addEventListener('click', this._onDocClick);\n  }\n\n  override disconnectedCallback(): void {\n    document.removeEventListener('click', this._onDocClick);\n    dismissTooltips(this);\n    super.disconnectedCallback();\n  }\n\n  /** Hover card on document.body. Matches the client chart tooltip. */\n  protected openTooltip(event: MouseEvent, content: ChartTooltipContent): void {\n    presentChartTooltip(this, event, content);\n  }\n\n  protected closeTooltip(): void {\n    dismissChartTooltip(this);\n  }\n\n  protected closeAllTooltips(): void {\n    dismissTooltips(this);\n  }\n\n  protected headerTitle(): string {\n    return resolveHeaderTitle(this.chartTitle, this.dataJson, this.showHeader);\n  }\n\n  protected axisLabelHandlers() {\n    return createAxisLabelHandlers(this, (t) => {\n      this._labelTooltip = t;\n    });\n  }\n\n  protected renderShellHeader(title: string) {\n    if (!title) return nothing;\n    return renderWidgetHeader({\n      title,\n      variant: this.headerVariant,\n      handlers: this._headerHandlers,\n      menuOpen: this._menuOpen,\n      onMenuToggle: (e: Event) => {\n        e.stopPropagation();\n        this._menuOpen = !this._menuOpen;\n      },\n      onMenuClose: () => {\n        this._menuOpen = false;\n      },\n      onDownload: () => dispatchChartDownload(this),\n    });\n  }\n\n  protected renderShellLabelTooltip() {\n    return renderLabelTooltip(this._labelTooltip);\n  }\n}\n\nexport { chartShellStyles };\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AA2BO,MAAe,2BAA2B,WAAW;AAAA,EAArD,cAAA;AAAA,UAAA,GAAA,SAAA;AAEL,SAAA,WAAW;AAGX,SAAA,aAAa;AAcb,SAAA,aAAa;AAab,SAAA,gBAAqC;AAMrC,SAAQ,kBAAwC,CAAA;AAchD,SAAU,gBAAmC;AAG7C,SAAU,YAAY;AAEtB,SAAU,cAAc,MAAY;AAClC,WAAK,YAAY;AAAA,IACnB;AAAA,EAAA;AAAA,EAnBA,IAAI,iBAAuC;AACzC,WAAO,KAAK;AAAA,EACd;AAAA,EAEA,IAAI,eAAe,OAA6B;AAC9C,UAAM,OAAO,SAAS,CAAA;AACtB,QAAI,SAAS,KAAK,gBAAiB;AACnC,SAAK,kBAAkB;AACvB,SAAK,cAAA;AAAA,EACP;AAAA,EAYS,oBAA0B;AACjC,UAAM,kBAAA;AACN,aAAS,iBAAiB,SAAS,KAAK,WAAW;AAAA,EACrD;AAAA,EAES,uBAA6B;AACpC,aAAS,oBAAoB,SAAS,KAAK,WAAW;AACtD,oBAAgB,IAAI;AACpB,UAAM,qBAAA;AAAA,EACR;AAAA;AAAA,EAGU,YAAY,OAAmB,SAAoC;AAC3E,wBAAoB,MAAM,OAAO,OAAO;AAAA,EAC1C;AAAA,EAEU,eAAqB;AAC7B,wBAAoB,IAAI;AAAA,EAC1B;AAAA,EAEU,mBAAyB;AACjC,oBAAgB,IAAI;AAAA,EACtB;AAAA,EAEU,cAAsB;AAC9B,WAAO,mBAAmB,KAAK,YAAY,KAAK,UAAU,KAAK,UAAU;AAAA,EAC3E;AAAA,EAEU,oBAAoB;AAC5B,WAAO,wBAAwB,MAAM,CAAC,MAAM;AAC1C,WAAK,gBAAgB;AAAA,IACvB,CAAC;AAAA,EACH;AAAA,EAEU,kBAAkB,OAAe;AACzC,QAAI,CAAC,MAAO,QAAO;AACnB,WAAO,mBAAmB;AAAA,MACxB;AAAA,MACA,SAAS,KAAK;AAAA,MACd,UAAU,KAAK;AAAA,MACf,UAAU,KAAK;AAAA,MACf,cAAc,CAAC,MAAa;AAC1B,UAAE,gBAAA;AACF,aAAK,YAAY,CAAC,KAAK;AAAA,MACzB;AAAA,MACA,aAAa,MAAM;AACjB,aAAK,YAAY;AAAA,MACnB;AAAA,MACA,YAAY,MAAM,sBAAsB,IAAI;AAAA,IAAA,CAC7C;AAAA,EACH;AAAA,EAEU,0BAA0B;AAClC,WAAO,mBAAmB,KAAK,aAAa;AAAA,EAC9C;AACF;AAlHE,gBAAA;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,WAAW,QAAQ;AAAA,GADzB,mBAEpB,WAAA,UAAA;AAGA,gBAAA;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,WAAW,eAAe;AAAA,GAJhC,mBAKpB,WAAA,YAAA;AAcA,gBAAA;AAAA,EAPC,SAAS;AAAA,IACR,WAAW;AAAA,MACT,eAAe,CAAC,UAAkC,UAAU,QAAQ,UAAU;AAAA,MAC9E,aAAa,CAAC,UAA4B,QAAQ,KAAK;AAAA,IAAA;AAAA,IAEzD,WAAW;AAAA,EAAA,CACZ;AAAA,GAlBmB,mBAmBpB,WAAA,YAAA;AAaA,gBAAA;AAAA,EANC,SAAS;AAAA,IACR,WAAW;AAAA,IACX,WAAW;AAAA,MACT,eAAe,CAAC,UAA8C,qBAAqB,KAAK;AAAA,IAAA;AAAA,EAC1F,CACD;AAAA,GA/BmB,mBAgCpB,WAAA,eAAA;AAoBU,gBAAA;AAAA,EADT,MAAA;AAAM,GAnDa,mBAoDV,WAAA,eAAA;AAGA,gBAAA;AAAA,EADT,MAAA;AAAM,GAtDa,mBAuDV,WAAA,WAAA;"}

package/dist/element/widget-header.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Host callbacks for the widget chrome. The chart never talks to Redux —
+ * the client (or any host) assigns these and implements the action.
+ * A button is rendered only when its handler is set, except chat download,
+ * which stays available and falls back to the `ui9000-download` event.
+ */
+export type WidgetHeaderHandlers = {
+    onOpenChat?: () => void;
+    onViewAsTable?: () => void;
+    onProvideFeedback?: () => void;
+    onSaveToReport?: () => void;
+    onDownloadImage?: () => void;
+    onRemove?: () => void;
+    onOpenSettings?: () => void;
+};
+/** `chat` = MCP / charts iframe. `dash` = FuseDash dashboard widget. */
+export type WidgetHeaderVariant = 'chat' | 'dash';
+export type HeaderMenuItem = {
+    id: string;
+    label: string;
+    /** Chat download with no host handler emits `ui9000-download`. */
+    fallbackDownload?: boolean;
+};
+export type HeaderChrome = {
+    variant: WidgetHeaderVariant;
+    showChat: boolean;
+    showSettings: boolean;
+    showMenu: boolean;
+    showRemove: boolean;
+    items: HeaderMenuItem[];
+};
+export declare function resolveHeaderVariant(value: string | null | undefined): WidgetHeaderVariant;
+export declare function resolveHeaderChrome(variant: WidgetHeaderVariant, handlers: WidgetHeaderHandlers): HeaderChrome;
+export declare function headerMenuHandler(item: HeaderMenuItem, handlers: WidgetHeaderHandlers): (() => void) | undefined;
+//# sourceMappingURL=widget-header.d.ts.map

package/dist/element/widget-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"widget-header.d.ts","sourceRoot":"","sources":["../../src/element/widget-header.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,MAAM,oBAAoB,GAAG;IACjC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B,CAAC;AAEF,wEAAwE;AACxE,MAAM,MAAM,mBAAmB,GAAG,MAAM,GAAG,MAAM,CAAC;AAElD,MAAM,MAAM,cAAc,GAAG;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,kEAAkE;IAClE,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,OAAO,EAAE,mBAAmB,CAAC;IAC7B,QAAQ,EAAE,OAAO,CAAC;IAClB,YAAY,EAAE,OAAO,CAAC;IACtB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,OAAO,CAAC;IACpB,KAAK,EAAE,cAAc,EAAE,CAAC;CACzB,CAAC;AAEF,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,GAC/B,mBAAmB,CAErB;AAED,wBAAgB,mBAAmB,CACjC,OAAO,EAAE,mBAAmB,EAC5B,QAAQ,EAAE,oBAAoB,GAC7B,YAAY,CAqCd;AAED,wBAAgB,iBAAiB,CAC/B,IAAI,EAAE,cAAc,EACpB,QAAQ,EAAE,oBAAoB,GAC7B,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAa1B"}

package/dist/element/widget-header.js

@@ -0,0 +1,59 @@
+function resolveHeaderVariant(value) {
+  return value === "dash" ? "dash" : "chat";
+}
+function resolveHeaderChrome(variant, handlers) {
+  if (variant === "chat") {
+    return {
+      variant,
+      showChat: false,
+      showSettings: false,
+      showMenu: true,
+      showRemove: false,
+      items: [
+        {
+          id: "download-image",
+          label: "Download image",
+          fallbackDownload: !handlers.onDownloadImage
+        }
+      ]
+    };
+  }
+  const items = [];
+  if (handlers.onViewAsTable) items.push({ id: "view-table", label: "View as table" });
+  if (handlers.onProvideFeedback) {
+    items.push({ id: "provide-feedback", label: "Provide feedback" });
+  }
+  if (handlers.onSaveToReport) items.push({ id: "save-report", label: "Add to page" });
+  if (handlers.onDownloadImage) {
+    items.push({ id: "download-image", label: "Download image" });
+  }
+  const showRemove = !!handlers.onRemove;
+  return {
+    variant,
+    showChat: !!handlers.onOpenChat,
+    showSettings: !!handlers.onOpenSettings,
+    showMenu: items.length > 0 || showRemove,
+    showRemove,
+    items
+  };
+}
+function headerMenuHandler(item, handlers) {
+  switch (item.id) {
+    case "view-table":
+      return handlers.onViewAsTable;
+    case "provide-feedback":
+      return handlers.onProvideFeedback;
+    case "save-report":
+      return handlers.onSaveToReport;
+    case "download-image":
+      return handlers.onDownloadImage;
+    default:
+      return void 0;
+  }
+}
+export {
+  headerMenuHandler,
+  resolveHeaderChrome,
+  resolveHeaderVariant
+};
+//# sourceMappingURL=widget-header.js.map

package/dist/element/widget-header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"widget-header.js","sources":["../../src/element/widget-header.ts"],"sourcesContent":["/**\n * Host callbacks for the widget chrome. The chart never talks to Redux —\n * the client (or any host) assigns these and implements the action.\n * A button is rendered only when its handler is set, except chat download,\n * which stays available and falls back to the `ui9000-download` event.\n */\nexport type WidgetHeaderHandlers = {\n  onOpenChat?: () => void;\n  onViewAsTable?: () => void;\n  onProvideFeedback?: () => void;\n  onSaveToReport?: () => void;\n  onDownloadImage?: () => void;\n  onRemove?: () => void;\n  onOpenSettings?: () => void;\n};\n\n/** `chat` = MCP / charts iframe. `dash` = FuseDash dashboard widget. */\nexport type WidgetHeaderVariant = 'chat' | 'dash';\n\nexport type HeaderMenuItem = {\n  id: string;\n  label: string;\n  /** Chat download with no host handler emits `ui9000-download`. */\n  fallbackDownload?: boolean;\n};\n\nexport type HeaderChrome = {\n  variant: WidgetHeaderVariant;\n  showChat: boolean;\n  showSettings: boolean;\n  showMenu: boolean;\n  showRemove: boolean;\n  items: HeaderMenuItem[];\n};\n\nexport function resolveHeaderVariant(\n  value: string | null | undefined,\n): WidgetHeaderVariant {\n  return value === 'dash' ? 'dash' : 'chat';\n}\n\nexport function resolveHeaderChrome(\n  variant: WidgetHeaderVariant,\n  handlers: WidgetHeaderHandlers,\n): HeaderChrome {\n  if (variant === 'chat') {\n    return {\n      variant,\n      showChat: false,\n      showSettings: false,\n      showMenu: true,\n      showRemove: false,\n      items: [\n        {\n          id: 'download-image',\n          label: 'Download image',\n          fallbackDownload: !handlers.onDownloadImage,\n        },\n      ],\n    };\n  }\n\n  const items: HeaderMenuItem[] = [];\n  if (handlers.onViewAsTable) items.push({ id: 'view-table', label: 'View as table' });\n  if (handlers.onProvideFeedback) {\n    items.push({ id: 'provide-feedback', label: 'Provide feedback' });\n  }\n  if (handlers.onSaveToReport) items.push({ id: 'save-report', label: 'Add to page' });\n  if (handlers.onDownloadImage) {\n    items.push({ id: 'download-image', label: 'Download image' });\n  }\n\n  const showRemove = !!handlers.onRemove;\n  return {\n    variant,\n    showChat: !!handlers.onOpenChat,\n    showSettings: !!handlers.onOpenSettings,\n    showMenu: items.length > 0 || showRemove,\n    showRemove,\n    items,\n  };\n}\n\nexport function headerMenuHandler(\n  item: HeaderMenuItem,\n  handlers: WidgetHeaderHandlers,\n): (() => void) | undefined {\n  switch (item.id) {\n    case 'view-table':\n      return handlers.onViewAsTable;\n    case 'provide-feedback':\n      return handlers.onProvideFeedback;\n    case 'save-report':\n      return handlers.onSaveToReport;\n    case 'download-image':\n      return handlers.onDownloadImage;\n    default:\n      return undefined;\n  }\n}\n"],"names":[],"mappings":"AAmCO,SAAS,qBACd,OACqB;AACrB,SAAO,UAAU,SAAS,SAAS;AACrC;AAEO,SAAS,oBACd,SACA,UACc;AACd,MAAI,YAAY,QAAQ;AACtB,WAAO;AAAA,MACL;AAAA,MACA,UAAU;AAAA,MACV,cAAc;AAAA,MACd,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,OAAO;AAAA,QACL;AAAA,UACE,IAAI;AAAA,UACJ,OAAO;AAAA,UACP,kBAAkB,CAAC,SAAS;AAAA,QAAA;AAAA,MAC9B;AAAA,IACF;AAAA,EAEJ;AAEA,QAAM,QAA0B,CAAA;AAChC,MAAI,SAAS,cAAe,OAAM,KAAK,EAAE,IAAI,cAAc,OAAO,iBAAiB;AACnF,MAAI,SAAS,mBAAmB;AAC9B,UAAM,KAAK,EAAE,IAAI,oBAAoB,OAAO,oBAAoB;AAAA,EAClE;AACA,MAAI,SAAS,eAAgB,OAAM,KAAK,EAAE,IAAI,eAAe,OAAO,eAAe;AACnF,MAAI,SAAS,iBAAiB;AAC5B,UAAM,KAAK,EAAE,IAAI,kBAAkB,OAAO,kBAAkB;AAAA,EAC9D;AAEA,QAAM,aAAa,CAAC,CAAC,SAAS;AAC9B,SAAO;AAAA,IACL;AAAA,IACA,UAAU,CAAC,CAAC,SAAS;AAAA,IACrB,cAAc,CAAC,CAAC,SAAS;AAAA,IACzB,UAAU,MAAM,SAAS,KAAK;AAAA,IAC9B;AAAA,IACA;AAAA,EAAA;AAEJ;AAEO,SAAS,kBACd,MACA,UAC0B;AAC1B,UAAQ,KAAK,IAAA;AAAA,IACX,KAAK;AACH,aAAO,SAAS;AAAA,IAClB,KAAK;AACH,aAAO,SAAS;AAAA,IAClB,KAAK;AACH,aAAO,SAAS;AAAA,IAClB,KAAK;AACH,aAAO,SAAS;AAAA,IAClB;AACE,aAAO;AAAA,EAAA;AAEb;"}