@xplortech/apollo-data 0.0.5 → 0.0.6

package/dist/components/p-gcjU8DVr.js

@@ -0,0 +1 @@
+function t(t,e,n){const o="undefined"!=typeof HTMLElement?HTMLElement.prototype:null;for(;t&&t!==o;){const o=Object.getOwnPropertyDescriptor(t,e);if(o&&(!n||o.get))return o;t=Object.getPrototypeOf(t)}}var e,n=(e,n)=>{var o;Object.entries(null!=(o=n.o.t)?o:{}).map((([o,[l]])=>{if(31&l||32&l){const l=e[o],r=t(Object.getPrototypeOf(e),o,!0)||Object.getOwnPropertyDescriptor(e,o);r&&Object.defineProperty(e,o,{get(){return r.get.call(this)},set(t){r.set.call(this,t)},configurable:!0,enumerable:!0}),n.l.has(o)?e[o]=n.l.get(o):void 0!==l&&(e[o]=l)}}))},o=t=>{if(t.__stencil__getHostRef)return t.__stencil__getHostRef()},l=(t,e)=>(0,console.error)(t,e),r="undefined"!=typeof window?window:{},s=r.HTMLElement||class{},i={i:0,u:"",jmp:t=>t(),raf:t=>requestAnimationFrame(t),ael:(t,e,n,o)=>t.addEventListener(e,n,o),rel:(t,e,n,o)=>t.removeEventListener(e,n,o),ce:(t,e)=>new CustomEvent(t,e)},c=!!(()=>{try{return!!r.document.adoptedStyleSheets&&(new CSSStyleSheet,"function"==typeof(new CSSStyleSheet).replaceSync)}catch(t){}return!1})()&&(()=>!!r.document&&Object.getOwnPropertyDescriptor(r.document.adoptedStyleSheets,"length").writable)(),u=!1,a=[],f=[],d=(t,e)=>n=>{t.push(n),u||(u=!0,e&&4&i.i?m(p):i.raf(p))},h=t=>{for(let e=0;e<t.length;e++)try{t[e](performance.now())}catch(t){l(t)}t.length=0},p=()=>{h(a),h(f),(u=a.length>0)&&i.raf(p)},m=t=>Promise.resolve(undefined).then(t),$=d(f,!0),b=t=>{const e=new URL(t,i.u);return e.origin!==r.location.origin?e.href:e.pathname},v=t=>i.u=t;function y(){const t=this.attachShadow({mode:"open"});void 0===e&&(e=null),e&&(c?t.adoptedStyleSheets.push(e):t.adoptedStyleSheets=[...t.adoptedStyleSheets,e])}var w,j=new WeakMap,O=t=>"object"==(t=typeof t)||"function"===t,g=(t,e,...n)=>{let o=null,l=null,r=!1,s=!1;const i=[],c=e=>{for(let n=0;n<e.length;n++)o=e[n],Array.isArray(o)?c(o):null!=o&&"boolean"!=typeof o&&((r="function"!=typeof t&&!O(o))&&(o=String(o)),r&&s?i[i.length-1].h+=o:i.push(r?S(null,o):o),s=r)};c(n),e&&e.key&&(l=e.key);const u=S(t,null);return u.p=e,i.length>0&&(u.m=i),u.$=l,u},S=(t,e)=>({i:0,v:t,h:null!=e?e:null,j:null,m:null,p:null,$:null}),M={},k=(t,e)=>null==t||O(t)?t:1&e?String(t):t,E=(t,e,n,l,r,s)=>{if(n===l)return;let i=((t,e)=>e in t)(t,e);if(e.toLowerCase(),"style"===e){for(const e in n)l&&null!=l[e]||(e.includes("-")?t.style.removeProperty(e):t.style[e]="");for(const e in l)n&&l[e]===n[e]||(e.includes("-")?t.style.setProperty(e,l[e]):t.style[e]=l[e])}else if("key"===e);else{if("a"===e[0]&&e.startsWith("attr:")){const n=e.slice(5);let r;{const e=o(t);if(e&&e.o&&e.o.t){const t=e.o.t[n];t&&t[1]&&(r=t[1])}}return r||(r=n.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase()),void(null==l||!1===l?!1===l&&""!==t.getAttribute(r)||t.removeAttribute(r):t.setAttribute(r,!0===l?"":l))}if("p"===e[0]&&e.startsWith("prop:")){const n=e.slice(5);try{t[n]=l}catch(t){}return}{const o=O(l);if((i||o&&null!==l)&&!r)try{if(t.tagName.includes("-"))t[e]!==l&&(t[e]=l);else{const o=null==l?"":l;"list"===e?i=!1:null!=n&&t[e]===o||("function"==typeof t.__lookupSetter__(e)?t[e]=o:t.setAttribute(e,o))}}catch(t){}null==l||!1===l?!1===l&&""!==t.getAttribute(e)||t.removeAttribute(e):(!i||4&s||r)&&!o&&1===t.nodeType&&t.setAttribute(e,l=!0===l?"":l)}}},C=(t,e,n)=>{const o=11===e.j.nodeType&&e.j.host?e.j.host:e.j,l=t&&t.p||{},r=e.p||{};for(const t of L(Object.keys(l)))t in r||E(o,t,l[t],void 0,n,e.i);for(const t of L(Object.keys(r)))E(o,t,l[t],r[t],n,e.i)};function L(t){return t.includes("ref")?[...t.filter((t=>"ref"!==t)),"ref"]:t}var _=!1,x=(t,e,n)=>{const o=e.m[n];let l,s,i=0;if(!r.document)throw new Error("You are trying to render a Stencil component in an environment that doesn't support the DOM.");if(l=o.j=r.document.createElement(o.v),C(null,o,_),o.m){const e="template"===o.v?l.content:l;for(i=0;i<o.m.length;++i)s=x(t,o,i),s&&e.appendChild(s)}return l["s-hn"]=w,l},A=(t,e,n,o,l,r)=>{let s,i=t;for(i.shadowRoot&&i.tagName===w&&(i=i.shadowRoot),"template"===n.v&&(i=i.content);l<=r;++l)o[l]&&(s=x(null,n,l),s&&(o[l].j=s,D(i,s,e)))},H=(t,e,n)=>{for(let o=e;o<=n;++o){const e=t[o];if(e){const t=e.j;t&&t.remove()}}},P=(t,e,n=!1)=>t.v===e.v&&(n?(n&&!t.$&&e.$&&(t.$=e.$),!0):t.$===e.$),U=(t,e,n=!1)=>{const o=e.j=t.j,l=t.m,r=e.m;C(t,e,_),null!==l&&null!==r?((t,e,n,o,l=!1)=>{let r,s,i=0,c=0,u=0,a=0,f=e.length-1,d=e[0],h=e[f],p=o.length-1,m=o[0],$=o[p];const b="template"===n.v?t.content:t;for(;i<=f&&c<=p;)if(null==d)d=e[++i];else if(null==h)h=e[--f];else if(null==m)m=o[++c];else if(null==$)$=o[--p];else if(P(d,m,l))U(d,m,l),d=e[++i],m=o[++c];else if(P(h,$,l))U(h,$,l),h=e[--f],$=o[--p];else if(P(d,$,l))U(d,$,l),D(b,d.j,h.j.nextSibling),d=e[++i],$=o[--p];else if(P(h,m,l))U(h,m,l),D(b,h.j,d.j),h=e[--f],m=o[++c];else{for(u=-1,a=i;a<=f;++a)if(e[a]&&null!==e[a].$&&e[a].$===m.$){u=a;break}u>=0?(s=e[u],s.v!==m.v?r=x(e&&e[c],n,u):(U(s,m,l),e[u]=void 0,r=s.j),m=o[++c]):(r=x(e&&e[c],n,c),m=o[++c]),r&&D(d.j.parentNode,r,d.j)}i>f?A(t,null==o[p+1]?null:o[p+1].j,n,o,c,p):c>p&&H(e,i,f)})(o,l,e,r,n):null!==r?A(o,null,e,r,0,r.length-1):!n&&null!==l&&H(l,0,l.length-1)},D=(t,e,n)=>t.__insertBefore?t.__insertBefore(e,n):null==t?void 0:t.insertBefore(e,n),R=(t,e,n=!1)=>{const o=t.$hostElement$,l=t.O||S(null,null);var r;const s=(r=e)&&r.v===M?e:g(null,null,e);if(w=o.tagName,n&&s.p)for(const t of Object.keys(s.p))o.hasAttribute(t)&&!["key","ref","style","class"].includes(t)&&(s.p[t]=o[t]);s.v=null,s.i|=4,t.O=s,s.j=l.j=o.shadowRoot||o,U(l,s,n)},W=(t,e)=>{if(e&&!t.S&&e["s-p"]){const n=e["s-p"].push(new Promise((o=>t.S=()=>{e["s-p"].splice(n-1,1),o()})))}},N=(t,e)=>{if(t.i|=16,4&t.i)return void(t.i|=512);W(t,t.M);const n=()=>q(t,e);if(!e)return $(n);queueMicrotask((()=>{n()}))},q=(t,e)=>{const n=t.$hostElement$,o=n;if(!o)throw new Error(`Can't render component <${n.tagName.toLowerCase()} /> with invalid Stencil runtime! Make sure this imported component is compiled with a \`externalRuntime: true\` flag. For more information, please refer to https://stenciljs.com/docs/custom-elements#externalruntime`);let l;return l=B(o,e?"componentWillLoad":"componentWillUpdate",void 0,n),l=z(l,(()=>B(o,"componentWillRender",void 0,n))),z(l,(()=>T(t,o,e)))},z=(t,e)=>F(t)?t.then(e).catch((t=>{console.error(t),e()})):e(),F=t=>t instanceof Promise||t&&t.then&&"function"==typeof t.then,T=async(t,e,n)=>{var o;const l=t.$hostElement$,r=l["s-rc"];V(t,e,l,n),r&&(r.map((t=>t())),l["s-rc"]=void 0);{const e=null!=(o=l["s-p"])?o:[],n=()=>Y(t);0===e.length?n():(Promise.all(e).then(n).catch(n),t.i|=4,e.length=0)}},V=(t,e,n,o)=>{try{e=e.render(),t.i&=-17,t.i|=2,R(t,e,o)}catch(e){l(e,t.$hostElement$)}return null},Y=t=>{const e=t.$hostElement$,n=e,o=t.M;B(n,"componentDidRender",void 0,e),64&t.i?B(n,"componentDidUpdate",void 0,e):(t.i|=64,G(e),B(n,"componentDidLoad",void 0,e),t.k(e),o||Z()),t.S&&(t.S(),t.S=void 0),512&t.i&&m((()=>N(t,!1))),t.i&=-517},Z=()=>{m((()=>(t=>{const e=i.ce("appload",{detail:{namespace:"apollo-data"}});return t.dispatchEvent(e),e})(r)))},B=(t,e,n,o)=>{if(t&&t[e])try{return t[e](n)}catch(t){l(t,o)}},G=t=>t.classList.add("hydrated"),I=(t,e,n,l)=>{const r=o(t);if(!r)return;const s=t,i=r.l.get(e),c=r.i,u=s;n=k(n,l.t[e][0]);const a=Number.isNaN(i)&&Number.isNaN(n);if(n!==i&&!a&&(r.l.set(e,n),2&c)){if(u.componentShouldUpdate&&!1===u.componentShouldUpdate(n,i,e)&&!(16&c))return;16&c||N(r,!1)}},J=(e,n)=>{var l,r;const s=e.prototype;if(n.t){const c=Object.entries(null!=(l=n.t)?l:{});c.map((([e,[l]])=>{if(31&l||32&l){const{get:r,set:i}=t(s,e)||{};r&&(n.t[e][0]|=2048),i&&(n.t[e][0]|=4096),Object.defineProperty(s,e,{get(){return r?r.apply(this):(t=e,o(this).l.get(t));var t},configurable:!0,enumerable:!0}),Object.defineProperty(s,e,{set(t){const r=o(this);if(r){if(i)return void 0===(32&l?this[e]:r.$hostElement$[e])&&r.l.get(e)&&(t=r.l.get(e)),i.apply(this,[k(t,l)]),void I(this,e,t=32&l?this[e]:r.$hostElement$[e],n);I(this,e,t,n)}}})}}));{const t=new Map;s.attributeChangedCallback=function(e,l,r){i.jmp((()=>{var i;const u=t.get(e),a=o(this);if(this.hasOwnProperty(u),s.hasOwnProperty(u)&&"number"==typeof this[u]&&this[u]==r)return;if(null==u){const t=null==a?void 0:a.i;if(a&&t&&!(8&t)&&r!==l){const o=this,s=null==(i=n.C)?void 0:i[e];null==s||s.forEach((n=>{const[[s,i]]=Object.entries(n);null!=o[s]&&(128&t||1&i)&&o[s].call(o,r,l,e)}))}return}const f=c.find((([t])=>t===u));f&&4&f[1][0]&&(r=null!==r&&"false"!==r);const d=Object.getOwnPropertyDescriptor(s,u);r==this[u]||d.get&&!d.set||(this[u]=r)}))},e.observedAttributes=Array.from(new Set([...Object.keys(null!=(r=n.C)?r:{}),...c.filter((([t,e])=>31&e[0])).map((([e,n])=>{const o=n[1]||e;return t.set(o,e),o}))]))}}return e},K=(t,e)=>{const r={i:e[0],L:e[1]};try{r.t=e[2];const s=t.prototype.connectedCallback,c=t.prototype.disconnectedCallback;return Object.assign(t.prototype,{__hasHostListenerAttached:!1,__registerHost(){((t,e)=>{const o={i:0,$hostElement$:t,o:e,l:new Map,_:new Map};o.A=new Promise((t=>o.k=t)),t["s-p"]=[],t["s-rc"]=[];const l=o;t.__stencil__getHostRef=()=>l,512&e.i&&n(t,o)})(this,r)},connectedCallback(){if(!this.__hasHostListenerAttached){if(!o(this))return;this.__hasHostListenerAttached=!0}(t=>{if(!(1&i.i)){const e=o(t);if(!e)return;const n=e.o,r=()=>{};if(1&e.i)(null==e?void 0:e.H)||(null==e?void 0:e.A)&&e.A.then((()=>{}));else{e.i|=1;{let n=t;for(;n=n.parentNode||n.host;)if(n["s-p"]){W(e,e.M=n);break}}n.t&&Object.entries(n.t).map((([e,[n]])=>{if(31&n&&Object.prototype.hasOwnProperty.call(t,e)){const n=t[e];delete t[e],t[e]=n}})),(async(t,e)=>{try{32&e.i||(e.i|=32,customElements.whenDefined(t.localName).then((()=>e.i|=128)));const n=e.M,o=()=>N(e,!0);n&&n["s-rc"]?n["s-rc"].push(o):o()}catch(n){l(n,t),e.S&&(e.S(),e.S=void 0),e.k&&e.k(t)}})(t,e)}r()}})(this),s&&s.call(this)},disconnectedCallback(){(async t=>{1&i.i||o(t),j.has(t)&&j.delete(t),t.shadowRoot&&j.has(t.shadowRoot)&&j.delete(t.shadowRoot)})(this),c&&c.call(this)},__attachShadow(){if(this.shadowRoot){if("open"!==this.shadowRoot.mode)throw new Error(`Unable to re-use existing shadow root for ${r.L}! Mode is set to ${this.shadowRoot.mode} but Stencil only supports open shadow roots.`)}else y.call(this,r)}}),Object.defineProperty(t,"is",{value:r.L,configurable:!0}),J(t,r)}catch(e){return l(e),t}},Q=t=>i.P=t,X=t=>Object.assign(i,t);function tt(t,e){R({$hostElement$:e},t)}function et(t){return t}export{M as H,Q as a,X as b,s as c,b as g,g as h,K as p,tt as r,v as s,et as t}

package/dist/esm/apollo-data-bar-chart.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, g as getElement, h, H as Host } from './index-Bb2nY-Tf.js';
-import { A as ApolloBase } from './apollo-data-base-BWkrM8dc.js';
+import { r as registerInstance, g as getElement, h, H as Host } from './index-D64asVrg.js';
+import { A as ApolloBase } from './apollo-data-base-C2k3WBpi.js';
 import { C as CHART_COLORS } from './constants-2nuV5Vny.js';
 
 const FONT_FAMILY = "apple-system, system-ui, 'Segoe UI', Arial, Helvetica, Roboto, sans-serif";
@@ -19,12 +19,13 @@ const ApolloDataBarChart = class extends ApolloBase {
         await this.renderChart();
     }
     injectTooltipStyles() {
-        if (ApolloDataBarChart.tooltipStylesInjected) {
+        const chartClass = this.constructor;
+        if (chartClass.tooltipStylesInjected) {
             return;
         }
         const styleId = 'apollo-data-bar-tooltip-styles';
         if (document.getElementById(styleId)) {
-            ApolloDataBarChart.tooltipStylesInjected = true;
+            chartClass.tooltipStylesInjected = true;
             return;
         }
         const style = document.createElement('style');
@@ -73,16 +74,16 @@ const ApolloDataBarChart = class extends ApolloBase {
       }
     `;
         document.head.appendChild(style);
-        ApolloDataBarChart.tooltipStylesInjected = true;
+        chartClass.tooltipStylesInjected = true;
     }
-    // @ts-ignore
     async getViewData(data, spec) {
+        const componentTag = this.el?.tagName?.toLowerCase() ?? 'apollo-data-bar-chart';
         if (!spec) {
-            throw new Error('adSpec is required for apollo-data-bar-chart');
+            throw new Error(`adSpec is required for ${componentTag}`);
         }
         const { tooltipPrefix = '', currencySymbol = '' } = spec;
         if (!data || data.length === 0) {
-            throw new Error('Data is required for apollo-data-bar-chart');
+            throw new Error(`Data is required for ${componentTag}`);
         }
         const uniqueCategories = Array.from(new Set(data.map(item => item.category)));
         const formatNumber = tooltipPrefix ? '.2f' : '.0f';
@@ -305,7 +306,7 @@ const ApolloDataBarChart = class extends ApolloBase {
         };
     }
     render() {
-        return (h(Host, { key: '86ed2e74e5abd57e684a93bc9cf6a014b3ed081c' }, h("div", { key: '96e5f7dd2dfa6a104ca709d1399308a86041c2f3', id: "container", style: { width: '100%', height: '100%' } })));
+        return (h(Host, { key: 'a0aebbff4fb177de35eb90329de81a1098663620' }, h("div", { key: '9e753e876df877d46254a02349850414914d9231', id: "container", style: { width: '100%', height: '100%' } })));
     }
 };
 

package/dist/esm/{apollo-data-base-BWkrM8dc.js → apollo-data-base-C2k3WBpi.js}

@@ -22829,7 +22829,7 @@ var boundsStream$1 = {
     boundsStream$1.lineEnd = boundsLineEnd;
     if (areaRingSum$1 < 0) lambda0 = -(lambda1 = 180), phi0 = -(phi1 = 90);
     else if (deltaSum > epsilon$3) phi1 = 90;
-    else if (deltaSum < -1e-6) phi0 = -90;
+    else if (deltaSum < -epsilon$3) phi0 = -90;
     range$4[0] = lambda0, range$4[1] = lambda1;
   },
   sphere: function() {
@@ -23430,7 +23430,7 @@ function polygonContains(polygon, point) {
   // from the point to the South pole.  If it is zero, then the point is the
   // same side as the South pole.
 
-  return (angle < -1e-6 || angle < epsilon$3 && sum < -1e-12) ^ (winding & 1);
+  return (angle < -epsilon$3 || angle < epsilon$3 && sum < -epsilon2) ^ (winding & 1);
 }
 
 function clip$1(pointVisible, clipLine, interpolate, start) {
@@ -23881,7 +23881,7 @@ function clipLine(a, b, x0, y0, x1, y1) {
   return true;
 }
 
-var clipMax = 1e9, clipMin = -1e9;
+var clipMax = 1e9, clipMin = -clipMax;
 
 // TODO Use d3-polygon’s polygonContains here for the ring check?
 // TODO Eliminate duplicate buffering in clipBuffer and polygon.push?
@@ -67611,17 +67611,12 @@ async function _embed(el, spec, opts = {}, loader) {
     return { view, spec, vgSpec, finalize, embedOptions: opts };
 }
 
-// @ts-ignore
-// eslint-disable-next-line @typescript-eslint/no-unnecessary-type-constraint
 class ApolloBase {
-    // @ts-ignore
-    getViewData(data, spec) {
-        throw new Error('getViewData is not implemented');
-    }
     async renderChart() {
         // Wait for shadow DOM to be ready
-        await new Promise(resolve => setTimeout(resolve, 0));
-        // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
+        await new Promise(resolve => {
+            setTimeout(resolve, 0);
+        });
         const container = this.el?.shadowRoot?.querySelector('#container');
         if (!container) {
             return;
@@ -67633,6 +67628,7 @@ class ApolloBase {
             spec = typeof this.adSpec === 'string' ? JSON.parse(this.adSpec) : this.adSpec;
         }
         catch (err) {
+            // eslint-disable-next-line no-console
             console.error('Error parsing data/spec', err);
             return;
         }

package/dist/esm/apollo-data-donut-chart.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, g as getElement, h, H as Host } from './index-Bb2nY-Tf.js';
-import { A as ApolloBase } from './apollo-data-base-BWkrM8dc.js';
+import { r as registerInstance, g as getElement, h, H as Host } from './index-D64asVrg.js';
+import { A as ApolloBase } from './apollo-data-base-C2k3WBpi.js';
 
 const ApolloDataDonutChart = class extends ApolloBase {
     constructor(hostRef) {
@@ -399,7 +399,7 @@ const ApolloDataDonutChart = class extends ApolloBase {
         };
     }
     render() {
-        return (h(Host, { key: 'fb26a6b02b83b0ce64a8301149b66f5d09a4a7b4' }, h("div", { key: 'fc08cdc3c0c0fda7f7c13149532eb61f511aa035', id: "container", style: { width: '100%', height: '100%' } })));
+        return (h(Host, { key: '5d9ba4976956c4f0d29b9aa8638373895c0c3f7f' }, h("div", { key: '2db6d1418492898de84a167e35ecc8b16d695942', id: "container", style: { width: '100%', height: '100%' } })));
     }
 };
 

package/dist/esm/{apollo-data-line-chart_2.entry.js → apollo-data-heat-map_4.entry.js}

@@ -1,7 +1,135 @@
-import { r as registerInstance, g as getElement, h, H as Host } from './index-Bb2nY-Tf.js';
-import { A as ApolloBase } from './apollo-data-base-BWkrM8dc.js';
+import { r as registerInstance, g as getElement, h, H as Host } from './index-D64asVrg.js';
+import { A as ApolloBase } from './apollo-data-base-C2k3WBpi.js';
 import { C as CHART_COLORS } from './constants-2nuV5Vny.js';
 
+const ApolloDataHeatMap = class extends ApolloBase {
+    constructor(hostRef) {
+        super();
+        registerInstance(this, hostRef);
+    }
+    get el() { return getElement(this); }
+    /**
+     * Data for the heat map. Each item defines a cell by xLabel, yLabel, and value.
+     * @property {string} xLabel - Label for the X-axis (horizontal).
+     * @property {string} yLabel - Label for the Y-axis (vertical).
+     * @property {number} value - Numeric value encoded as color.
+     */
+    adData = [];
+    /**
+     * Optional specification for axis titles, color range, and tooltip behavior.
+     * @property {string} [xAxisTitle] - Label for the X-axis.
+     * @property {string} [yAxisTitle] - Label for the Y-axis.
+     * @property {string[]} [colorRange] - Two or more colors for the value scale (Vega interpolates between them).
+     * @property {'auto' | 'none'} [tooltip] - Tooltip behavior.
+     */
+    adSpec = {};
+    async componentDidRender() {
+        await this.renderChart();
+    }
+    DEFAULT_COLOR_RANGE = ['#e8f4f8', '#0066a1'];
+    // @ts-ignore
+    async getViewData(data, spec) {
+        const rawRange = spec?.colorRange;
+        const colorRange = Array.isArray(rawRange) && rawRange.length >= 2 ? rawRange : this.DEFAULT_COLOR_RANGE;
+        const tooltip = spec?.tooltip !== 'none';
+        const valid = data.filter(d => d != null && typeof d.xLabel === 'string' && typeof d.yLabel === 'string' && d.xLabel !== '' && d.yLabel !== '' && typeof d.value === 'number');
+        const xLabels = [...new Set(valid.map(d => d.xLabel))];
+        const yLabels = [...new Set(valid.map(d => d.yLabel))];
+        return {
+            $schema: 'https://vega.github.io/schema/vega/v6.json',
+            description: 'A heat map with xLabel and yLabel categories and value encoded as color.',
+            width: 450,
+            height: 350,
+            padding: { left: 5, top: 5, bottom: 5, right: 70 },
+            autosize: { type: 'fit', resize: true },
+            data: [
+                {
+                    name: 'source',
+                    values: valid,
+                },
+            ],
+            scales: [
+                {
+                    name: 'xscale',
+                    type: 'band',
+                    range: [0, { signal: 'width' }],
+                    domain: xLabels,
+                    padding: 0.05,
+                },
+                {
+                    name: 'yscale',
+                    type: 'band',
+                    range: [{ signal: 'height' }, 0],
+                    domain: yLabels,
+                    padding: 0.05,
+                },
+                {
+                    name: 'color',
+                    type: 'sequential',
+                    range: colorRange,
+                    domain: { data: 'source', field: 'value' },
+                    zero: true,
+                },
+            ],
+            axes: [
+                {
+                    orient: 'bottom',
+                    scale: 'xscale',
+                    title: spec?.xAxisTitle ?? 'X',
+                    labelAngle: -90,
+                    labelAlign: 'right',
+                },
+                {
+                    orient: 'left',
+                    scale: 'yscale',
+                    title: spec?.yAxisTitle ?? 'Y',
+                },
+            ],
+            legends: [
+                {
+                    type: 'gradient',
+                    fill: 'color',
+                    orient: 'right',
+                    direction: 'vertical',
+                    title: 'Value',
+                    titleLimit: 120,
+                    tickCount: 5,
+                    format: 's',
+                },
+            ],
+            marks: [
+                {
+                    type: 'rect',
+                    from: { data: 'source' },
+                    encode: {
+                        ...(tooltip && {
+                            enter: {
+                                tooltip: {
+                                    signal: "datum.xLabel + ' | ' + datum.yLabel + ' | ' + format(datum.value, ',.2f')",
+                                },
+                            },
+                        }),
+                        update: {
+                            x: { scale: 'xscale', field: 'xLabel' },
+                            y: { scale: 'yscale', field: 'yLabel' },
+                            width: { scale: 'xscale', band: 1 },
+                            height: { scale: 'yscale', band: 1 },
+                            fill: { scale: 'color', field: 'value' },
+                        },
+                        hover: {
+                            fill: { value: 'firebrick' },
+                            opacity: { value: 0.8 },
+                        },
+                    },
+                },
+            ],
+        };
+    }
+    render() {
+        return (h(Host, { key: 'd15b44f268f153498e61dc7829fe0d45f315a992' }, h("div", { key: '7783444f4675c885980f1cd571737d506e00fdbc', id: "container", style: { width: '100%', height: '100%' } })));
+    }
+};
+
 const FONT_FAMILY = "apple-system, system-ui, 'Segoe UI', Arial, Helvetica, Roboto, sans-serif";
 function lineStyleToStrokeDash(lineStyle) {
     switch (lineStyle) {
@@ -30,12 +158,13 @@ const ApolloDataLineChart = class extends ApolloBase {
         await this.renderChart();
     }
     injectTooltipStyles() {
-        if (ApolloDataLineChart.tooltipStylesInjected) {
+        const chartClass = this.constructor;
+        if (chartClass.tooltipStylesInjected) {
             return;
         }
         const styleId = 'apollo-data-line-tooltip-styles';
         if (document.getElementById(styleId)) {
-            ApolloDataLineChart.tooltipStylesInjected = true;
+            chartClass.tooltipStylesInjected = true;
             return;
         }
         const style = document.createElement('style');
@@ -84,16 +213,17 @@ const ApolloDataLineChart = class extends ApolloBase {
       }
     `;
         document.head.appendChild(style);
-        ApolloDataLineChart.tooltipStylesInjected = true;
+        chartClass.tooltipStylesInjected = true;
     }
     // @ts-ignore
     async getViewData(data, spec) {
+        const componentTag = this.el?.tagName?.toLowerCase() ?? 'apollo-data-line-chart';
         if (!spec) {
-            throw new Error('adSpec is required for apollo-data-line-chart');
+            throw new Error(`adSpec is required for ${componentTag}`);
         }
         const { tooltipPrefix = '', currencySymbol = '' } = spec;
         if (!data || data.length === 0) {
-            throw new Error('Data is required for apollo-data-line-chart');
+            throw new Error(`Data is required for ${componentTag}`);
         }
         const uniqueCategories = Array.from(new Set(data.map(item => item.category)));
         const uniqueXValues = [...new Set(data.map(item => item.xValue))].sort((a, b) => a - b);
@@ -284,7 +414,7 @@ const ApolloDataLineChart = class extends ApolloBase {
         };
     }
     render() {
-        return (h(Host, { key: '7799f01536f212d7a06da08c1e463d8529c5bf21' }, h("div", { key: '25463f10bbc0f5443c35ab03b5b53164d9ad1efd', id: "container", style: { width: '100%', height: '100%' } })));
+        return (h(Host, { key: 'fd64f4abb624b14a878808b23345910c9b23a72c' }, h("div", { key: 'aeda5086730862ca1368a0374caf2d918969839d', id: "container", style: { width: '100%', height: '100%' } })));
     }
 };
 
@@ -524,8 +654,225 @@ const ApolloDataScatterChart = class extends ApolloBase {
         };
     }
     render() {
-        return (h(Host, { key: '60005ab926b0153b3e31729a69f5a64cf6558085' }, h("div", { key: '820de3e0ddbbc2650b9764e279d87531338e72e3', id: "container", style: { width: '100%', height: '100%' } })));
+        return (h(Host, { key: 'f6c1e8d9e9a6ba41dbbf8c2c5737895b96b0915d' }, h("div", { key: '2aeba82bc31c5995a3d5b532c339f5b45ae850f7', id: "container", style: { width: '100%', height: '100%' } })));
+    }
+};
+
+const ApolloDataWorldMapChart = class extends ApolloBase {
+    constructor(hostRef) {
+        super();
+        registerInstance(this, hostRef);
+    }
+    get el() { return getElement(this); }
+    /**
+     * Represents a single data point in the world map chart.
+     * @property {number} lon - Longitude coordinate used to position the point on the map.
+     * @property {number} lat - Latitude coordinate used to position the point on the map.
+     * @property {number} value - A numeric metric tied to the point.
+     * @property {string} label - Label displayed for the place or location represented by the point.
+     */
+    adData = [];
+    /**
+     * @property {string} pinColor - Color of the pin representing the point.
+     * @property {'circle' | 'square' | 'triangle'} pinShape - Shape of the pin representing the point.
+     */
+    adSpec = {};
+    async componentDidRender() {
+        await this.renderChart();
+    }
+    // @ts-ignore
+    // eslint-disable-next-line class-methods-use-this
+    async getViewData(data, spec) {
+        const pinColor = spec?.pinColor || '#d3544b';
+        const pinShape = spec?.pinShape || 'circle';
+        return {
+            $schema: 'https://vega.github.io/schema/vega/v6.json',
+            description: 'World map + tooltip + points.',
+            width: 600,
+            height: 400,
+            autosize: 'none',
+            background: '#cfe3f1',
+            signals: [
+                {
+                    name: 'scale',
+                    value: 85,
+                    on: [
+                        {
+                            events: { type: 'wheel', consume: true },
+                            update: 'clamp(scale * pow(1.002, -event.deltaY), 85, 2000)',
+                        },
+                    ],
+                },
+                {
+                    name: 'xc',
+                    value: 0,
+                    on: [{ events: 'mousedown', update: 'x()' }],
+                },
+                {
+                    name: 'yc',
+                    value: 0,
+                    on: [{ events: 'mousedown', update: 'y()' }],
+                },
+                {
+                    name: 'xo',
+                    value: 300,
+                    on: [{ events: 'mousedown', update: 'tx' }],
+                },
+                {
+                    name: 'yo',
+                    value: 175,
+                    on: [{ events: 'mousedown', update: 'ty' }],
+                },
+                {
+                    name: 'tx',
+                    value: 300,
+                    on: [
+                        {
+                            events: '[mousedown, window:mouseup] > window:mousemove',
+                            update: 'xo - (x() - xc)',
+                        },
+                    ],
+                },
+                {
+                    name: 'ty',
+                    value: 270,
+                    on: [
+                        {
+                            events: '[mousedown, window:mouseup] > window:mousemove',
+                            update: 'clamp(yo + y() - yc, -scale * 0.5, scale * 2.5 + height)',
+                        },
+                    ],
+                },
+            ],
+            projections: [
+                {
+                    name: 'projection',
+                    type: 'mercator',
+                    scale: { signal: 'scale' },
+                    rotate: [{ signal: '-(tx - width / 2) * 180 / (scale * PI)' }, 0, 0],
+                    center: [0, 0],
+                    translate: [{ signal: 'width / 2' }, { signal: 'ty' }],
+                },
+            ],
+            data: [
+                {
+                    name: 'names',
+                    url: 'https://raw.githubusercontent.com/KoGor/Map-Icons-Generator/master/data/world-110m-country-names.tsv',
+                    format: { type: 'tsv' },
+                    transform: [{ type: 'formula', as: 'id', expr: 'toNumber(datum.id)' }],
+                },
+                {
+                    name: 'metrics',
+                    values: data,
+                },
+                {
+                    name: 'world',
+                    url: 'https://vega.github.io/editor/data/world-110m.json',
+                    format: { type: 'topojson', feature: 'countries' },
+                    transform: [
+                        {
+                            type: 'lookup',
+                            from: 'names',
+                            key: 'id',
+                            fields: ['id'],
+                            values: ['name'],
+                            as: ['name'],
+                        },
+                        { type: 'filter', expr: "datum.name != 'Antarctica'" },
+                    ],
+                },
+                {
+                    name: 'points',
+                    source: 'metrics',
+                    transform: [
+                        { type: 'filter', expr: 'isValid(datum.lon) && isValid(datum.lat)' },
+                        {
+                            type: 'geopoint',
+                            projection: 'projection',
+                            fields: ['lon', 'lat'],
+                            as: ['x', 'y'],
+                        },
+                    ],
+                },
+                {
+                    name: 'continentLabels',
+                    values: [
+                        { name: 'North America', lon: -105, lat: 45 },
+                        { name: 'South America', lon: -60, lat: -15 },
+                        { name: 'Europe', lon: 15, lat: 52 },
+                        { name: 'Africa', lon: 20, lat: 5 },
+                        { name: 'Asia', lon: 90, lat: 35 },
+                        { name: 'Oceania', lon: 135, lat: -25 },
+                    ],
+                    transform: [
+                        {
+                            type: 'geopoint',
+                            projection: 'projection',
+                            fields: ['lon', 'lat'],
+                            as: ['x', 'y'],
+                        },
+                    ],
+                },
+            ],
+            marks: [
+                {
+                    type: 'shape',
+                    from: { data: 'world' },
+                    transform: [{ type: 'geoshape', projection: 'projection' }],
+                    encode: {
+                        update: {
+                            fill: { value: '#8fbf8f' },
+                            stroke: { value: '#6c8c8c' },
+                            strokeWidth: { value: 0.7 },
+                            tooltip: { signal: "{Country: datum.name ? datum.name : 'Unknown'}" },
+                        },
+                        hover: {
+                            stroke: { value: '#2b3a42' },
+                            strokeWidth: { value: 1.3 },
+                        },
+                    },
+                },
+                {
+                    type: 'symbol',
+                    from: { data: 'points' },
+                    encode: {
+                        update: {
+                            x: { field: 'x' },
+                            y: { field: 'y' },
+                            size: { value: 80 },
+                            fill: { value: pinColor },
+                            stroke: { value: 'white' },
+                            shape: { value: pinShape },
+                            strokeWidth: { value: 1 },
+                            tooltip: {
+                                signal: '{Label: datum.label, Value: datum.value, Latitude: datum.lat, Longitude: datum.lon}',
+                            },
+                        },
+                    },
+                },
+                {
+                    type: 'text',
+                    from: { data: 'continentLabels' },
+                    encode: {
+                        update: {
+                            x: { field: 'x' },
+                            y: { field: 'y' },
+                            text: { field: 'name' },
+                            align: { value: 'center' },
+                            baseline: { value: 'middle' },
+                            fontSize: { value: 12 },
+                            fontWeight: { value: '600' },
+                            fill: { value: '#2b3a42' },
+                            fillOpacity: { value: 0.5 },
+                        },
+                    },
+                },
+            ],
+        };
+    }
+    render() {
+        return (h(Host, { key: '8053ea3b9706cdd03a430157b3f63e93c1201d1f' }, h("div", { key: '514807ae8dd4868d3d74e86c4260b7b9967c0ac2', id: "container", style: { width: '100%', height: '100%' } })));
     }
 };
 
-export { ApolloDataLineChart as apollo_data_line_chart, ApolloDataScatterChart as apollo_data_scatter_chart };
+export { ApolloDataHeatMap as apollo_data_heat_map, ApolloDataLineChart as apollo_data_line_chart, ApolloDataScatterChart as apollo_data_scatter_chart, ApolloDataWorldMapChart as apollo_data_world_map_chart };

package/dist/esm/apollo-data.js

@@ -1,9 +1,9 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-Bb2nY-Tf.js';
-export { s as setNonce } from './index-Bb2nY-Tf.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-D64asVrg.js';
+export { s as setNonce } from './index-D64asVrg.js';
 import { g as globalScripts } from './app-globals-DQuL1Twl.js';
 
 /*
- Stencil Client Patch Browser v4.41.3 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v4.43.2 | MIT Licensed | https://stenciljs.com
  */
 
 var patchBrowser = () => {
@@ -17,5 +17,5 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await globalScripts();
-  return bootstrapLazy([["apollo-data-line-chart_2",[[513,"apollo-data-line-chart",{"adData":[1,"ad-data"],"adSpec":[1,"ad-spec"]}],[513,"apollo-data-scatter-chart",{"adData":[1,"ad-data"],"adSpec":[1,"ad-spec"]}]]],["apollo-data-bar-chart",[[513,"apollo-data-bar-chart",{"adData":[1,"ad-data"],"adSpec":[1,"ad-spec"]}]]],["apollo-data-donut-chart",[[513,"apollo-data-donut-chart",{"adData":[1,"ad-data"],"adSpec":[1,"ad-spec"]}]]]], options);
+  return bootstrapLazy([["apollo-data-heat-map_4",[[513,"apollo-data-heat-map",{"adData":[1,"ad-data"],"adSpec":[1,"ad-spec"]}],[513,"apollo-data-line-chart",{"adData":[1,"ad-data"],"adSpec":[1,"ad-spec"]}],[513,"apollo-data-scatter-chart",{"adData":[1,"ad-data"],"adSpec":[1,"ad-spec"]}],[513,"apollo-data-world-map-chart",{"adData":[1,"ad-data"],"adSpec":[1,"ad-spec"]}]]],["apollo-data-bar-chart",[[513,"apollo-data-bar-chart",{"adData":[1,"ad-data"],"adSpec":[1,"ad-spec"]}]]],["apollo-data-donut-chart",[[513,"apollo-data-donut-chart",{"adData":[1,"ad-data"],"adSpec":[1,"ad-spec"]}]]]], options);
 });