@xplortech/insights-elements 0.0.1-draft.7729525

package/dist/esm/index-CSTD3N9t.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-CSTD3N9t.js","sources":["src/utils/insights-context.ts"],"sourcesContent":["export type EventType = 'error' | 'warning';\n\nexport interface EventData {\n  eventType: EventType;\n  data: any;\n}\n\nexport interface ConfigurationItem {\n  apiUrl: string;\n  token?: string;\n  refreshToken?: () => Promise<string> | string;\n  onEventEmitted?: (event: EventData) => void;\n}\n\nexport interface Configuration {\n  [configName: string]: ConfigurationItem;\n}\n\n// Global configuration store\nlet globalConfigurations: Configuration = {};\n\n/**\n * Setup multiple configurations for insights\n * @param configurations - Map of configuration names to configuration items\n * @example\n * ```typescript\n * setupConfiguration({\n *   default: {\n *     apiUrl: 'https://api.example.com',\n *     token: 'token123',\n *     refreshToken: async () => 'newToken',\n *     onEventEmitted: (event) => console.log(event)\n *   },\n *   europe: {\n *     apiUrl: 'https://api.eu.example.com',\n *     token: 'euToken123'\n *   }\n * });\n * ```\n */\nexport const setupConfiguration = (configurations: Configuration) => {\n  globalConfigurations = configurations;\n};\n\n/**\n * Get configuration by name\n * @param configName - Name of the configuration to retrieve (defaults to 'default')\n */\nexport const getConfiguration = (configName?: string): ConfigurationItem | undefined => {\n  const name = configName || 'default';\n  return globalConfigurations[name];\n};\n"],"names":[],"mappings":"AAkBA;AACA,IAAI,oBAAoB,GAAkB,EAAE;AAE5C;;;;;;;;;;;;;;;;;;AAkBG;AACU,MAAA,kBAAkB,GAAG,CAAC,cAA6B,KAAI;IAClE,oBAAoB,GAAG,cAAc;AACvC;AAEA;;;AAGG;AACU,MAAA,gBAAgB,GAAG,CAAC,UAAmB,KAAmC;AACrF,IAAA,MAAM,IAAI,GAAG,UAAU,IAAI,SAAS;AACpC,IAAA,OAAO,oBAAoB,CAAC,IAAI,CAAC;AACnC;;;;"}

package/dist/esm/index.js

@@ -0,0 +1,2 @@
+export { s as setupConfiguration } from './index-CSTD3N9t.js';
+//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/esm/insights-bar-chart.entry.js

@@ -0,0 +1,40 @@
+import { r as registerInstance, g as getElement, h } from './index-BAqvP5--.js';
+import { I as InsightsChartBase } from './insights-chart-base-uNbdsloe.js';
+
+const insightsBarChartCss = ":host{display:block}.insights-bar-chart{width:100%;height:100%;min-height:300px;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:300px}.spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #3498db;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.loading-container p{margin-top:16px;color:#666}.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:300px;padding:20px}.error-message{color:#e74c3c;margin-bottom:16px;text-align:center}.error-container button{padding:8px 16px;background-color:#3498db;color:white;border:none;border-radius:4px;cursor:pointer;font-size:14px}.error-container button:hover{background-color:#2980b9}.chart-container{width:100%;height:100%;padding:20px}.no-data{display:flex;align-items:center;justify-content:center;height:100%;min-height:300px;color:#999}";
+
+const InsightsBarChart = class extends InsightsChartBase {
+    constructor(hostRef) {
+        super();
+        registerInstance(this, hostRef);
+    }
+    get el() { return getElement(this); }
+    componentWillLoad() {
+        this.fetchChartData();
+    }
+    handlePropsChange() {
+        this.fetchChartData();
+    }
+    renderChart() {
+        if (!this.data || this.data.length === 0) {
+            return h("div", { class: "no-data" }, "No data available");
+        }
+        return (h("div", { class: "chart-container" }, h("apollo-data-bar-chart", { ref: el => {
+                if (el) {
+                    el.adData = this.data;
+                    el.adSpec = this.spec || {};
+                }
+            } })));
+    }
+    render() {
+        return (h("div", { key: 'cc42b49e957eba1e8cfef55ff2e4a212456489c6', class: "insights-bar-chart" }, this.loading && (h("div", { key: 'c82db2f39efa98f3429d21608afaced7623bac6a', class: "loading-container" }, h("div", { key: '05e31d66e3c0ee4f58bde4e4ddc16fcd969f3e80', class: "spinner" }), h("p", { key: 'e6626e2ae87ba94aed71d9610f5f54e8c1978899' }, "Loading chart data..."))), this.error && (h("div", { key: 'c77589a081583bfb82ac224c7969db69391a7a24', class: "error-container" }, h("p", { key: '53578a6f3344a29aa4f54f8a1b3f2f8a6bc8e32e', class: "error-message" }, this.error), h("button", { key: 'bf102ad25e23c2b894d1c0d49ac788f9c5979fac', onClick: () => this.fetchChartData() }, "Retry"))), !this.loading && !this.error && this.renderChart()));
+    }
+    static get watchers() { return {
+        "reportName": ["handlePropsChange"],
+        "filters": ["handlePropsChange"]
+    }; }
+};
+InsightsBarChart.style = insightsBarChartCss;
+
+export { InsightsBarChart as insights_bar_chart };
+//# sourceMappingURL=insights-bar-chart.entry.js.map

package/dist/esm/insights-bar-chart.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"insights-bar-chart.entry.js","sources":["src/components/insights-bar-chart/insights-bar-chart.css?tag=insights-bar-chart&encapsulation=shadow","src/components/insights-bar-chart/insights-bar-chart.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.insights-bar-chart {\n  width: 100%;\n  height: 100%;\n  min-height: 300px;\n  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;\n}\n\n.loading-container {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  min-height: 300px;\n}\n\n.spinner {\n  width: 40px;\n  height: 40px;\n  border: 4px solid #f3f3f3;\n  border-top: 4px solid #3498db;\n  border-radius: 50%;\n  animation: spin 1s linear infinite;\n}\n\n@keyframes spin {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\n.loading-container p {\n  margin-top: 16px;\n  color: #666;\n}\n\n.error-container {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  min-height: 300px;\n  padding: 20px;\n}\n\n.error-message {\n  color: #e74c3c;\n  margin-bottom: 16px;\n  text-align: center;\n}\n\n.error-container button {\n  padding: 8px 16px;\n  background-color: #3498db;\n  color: white;\n  border: none;\n  border-radius: 4px;\n  cursor: pointer;\n  font-size: 14px;\n}\n\n.error-container button:hover {\n  background-color: #2980b9;\n}\n\n.chart-container {\n  width: 100%;\n  height: 100%;\n  padding: 20px;\n}\n\n.no-data {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  min-height: 300px;\n  color: #999;\n}\n","import { Component, h, Watch, Element } from '@stencil/core';\nimport type { BarDataItem, BarSpec } from '@xplortech/apollo-data/dist/types/components.d.ts';\nimport { InsightsChartBase } from '../insights-chart-base';\n\n@Component({\n  tag: 'insights-bar-chart',\n  styleUrl: 'insights-bar-chart.css',\n  shadow: true,\n})\nexport class InsightsBarChart extends InsightsChartBase<BarDataItem[], BarSpec> {\n  @Element() el: HTMLElement = null;\n\n  componentWillLoad() {\n    this.fetchChartData();\n  }\n\n  @Watch('reportName')\n  @Watch('filters')\n  handlePropsChange() {\n    this.fetchChartData();\n  }\n\n  private renderChart() {\n    if (!this.data || this.data.length === 0) {\n      return <div class=\"no-data\">No data available</div>;\n    }\n\n    return (\n      <div class=\"chart-container\">\n        <apollo-data-bar-chart\n          ref={el => {\n            if (el) {\n              el.adData = this.data;\n              el.adSpec = this.spec || {};\n            }\n          }}\n        />\n      </div>\n    );\n  }\n\n  render() {\n    return (\n      <div class=\"insights-bar-chart\">\n        {this.loading && (\n          <div class=\"loading-container\">\n            <div class=\"spinner\"></div>\n            <p>Loading chart data...</p>\n          </div>\n        )}\n\n        {this.error && (\n          <div class=\"error-container\">\n            <p class=\"error-message\">{this.error}</p>\n            <button onClick={() => this.fetchChartData()}>Retry</button>\n          </div>\n        )}\n\n        {!this.loading && !this.error && this.renderChart()}\n      </div>\n    );\n  }\n}\n"],"names":[],"mappings":";;;AAAA,MAAM,mBAAmB,GAAG,wpCAAwpC;;MCSvqC,gBAAiB,GAAA,cAAQ,iBAAyC,CAAA;;;;;;IAG7E,iBAAiB,GAAA;QACf,IAAI,CAAC,cAAc,EAAE;;IAKvB,iBAAiB,GAAA;QACf,IAAI,CAAC,cAAc,EAAE;;IAGf,WAAW,GAAA;AACjB,QAAA,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,CAAC,MAAM,KAAK,CAAC,EAAE;AACxC,YAAA,OAAO,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,SAAS,wBAAwB;;QAGrD,QACE,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,iBAAiB,EAAA,EAC1B,CAAA,CAAA,uBAAA,EAAA,EACE,GAAG,EAAE,EAAE,IAAG;gBACR,IAAI,EAAE,EAAE;AACN,oBAAA,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,IAAI;oBACrB,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,IAAI,IAAI,EAAE;;AAE/B,aAAC,EAAA,CACD,CACE;;IAIV,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,oBAAoB,EAAA,EAC5B,IAAI,CAAC,OAAO,KACX,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,mBAAmB,EAAA,EAC5B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAO,CAAA,EAC3B,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAA,uBAAA,CAA4B,CACxB,CACP,EAEA,IAAI,CAAC,KAAK,KACT,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,iBAAiB,EAAA,EAC1B,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,KAAK,EAAC,eAAe,IAAE,IAAI,CAAC,KAAK,CAAK,EACzC,CAAQ,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAE,MAAM,IAAI,CAAC,cAAc,EAAE,EAAgB,EAAA,OAAA,CAAA,CACxD,CACP,EAEA,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,WAAW,EAAE,CAC/C;;;;;;;;;;;"}

package/dist/esm/insights-chart-base-uNbdsloe.js

@@ -0,0 +1,100 @@
+import { r as registerInstance } from './index-BAqvP5--.js';
+
+/**
+ * Default implementation of getQueryByFilters
+ */
+const defaultGetQueryByFilters = (filters) => {
+    return {
+        columns: ['*'],
+        ...filters,
+    };
+};
+/**
+ * Default implementation of normalizeRawResponse
+ */
+const defaultNormalizeRawResponse = (responseData) => {
+    return responseData.data || responseData;
+};
+
+const InsightsChartBase = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+    }
+    /**
+     * Name of the report to fetch data from
+     */
+    reportName;
+    /**
+     * Filters to apply to the query
+     */
+    filters;
+    /**
+     * Function to transform filters into a query object
+     */
+    getQueryByFilters;
+    /**
+     * Function to normalize the raw API response
+     */
+    normalizeRawResponse;
+    /**
+     * Optional specification object for customizing the chart appearance
+     */
+    spec;
+    /**
+     * Loading state
+     */
+    loading = false;
+    /**
+     * Chart data
+     */
+    data = null;
+    /**
+     * Error state
+     */
+    error = null;
+    /**
+     * Fetch chart data from the Insights API via parent wrapper
+     */
+    async fetchChartData() {
+        this.loading = true;
+        this.error = null;
+        try {
+            // Find parent insights-wrapper
+            const wrapper = this.el?.closest('insights-wrapper');
+            if (!wrapper) {
+                return null;
+                // throw new Error('Chart component must be used inside <insights-wrapper>');
+            }
+            // Build query using provided function or default
+            const queryBuilder = this.getQueryByFilters || defaultGetQueryByFilters;
+            const query = queryBuilder(this.filters || {});
+            // Fetch raw data through wrapper
+            const response = await wrapper.fetchData(this.reportName, query);
+            // Normalize response using provided function or default
+            if (this.normalizeRawResponse) {
+                this.data = this.normalizeRawResponse(response);
+            }
+            else {
+                const normalizer = defaultNormalizeRawResponse;
+                this.data = normalizer(response);
+            }
+            this.loading = false;
+        }
+        catch (err) {
+            this.error = err.message || 'Failed to fetch chart data';
+            this.loading = false;
+            console.error('Error fetching chart data:', err);
+        }
+    }
+    /**
+     * Refresh the chart data
+     */
+    async refresh() {
+        await this.fetchChartData();
+    }
+};
+
+export { InsightsChartBase as I };
+//# sourceMappingURL=insights-chart-base-uNbdsloe.js.map
+
+//# sourceMappingURL=insights-chart-base-uNbdsloe.js.map

package/dist/esm/insights-chart-base-uNbdsloe.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"insights-chart-base-uNbdsloe.js","sources":["src/utils/chart-types.ts","src/components/insights-chart-base.ts"],"sourcesContent":["/**\n * Filters for chart data queries\n */\nexport interface ChartFilters {\n  [key: string]: any;\n}\n\n/**\n * Query structure for insights API\n */\nexport interface InsightsQuery {\n  columns: string[];\n  [key: string]: any;\n}\n\n/**\n * Raw response from insights API\n */\nexport interface RawInsightsResponse {\n  data: any[];\n  [key: string]: any;\n}\n\n/**\n * Base props that all chart components will inherit\n */\nexport interface BaseChartProps {\n  /**\n   * Name of the report to fetch data from\n   */\n  reportName: string;\n\n  /**\n   * Filters to apply to the query\n   */\n  filters?: ChartFilters;\n\n  /**\n   * Function to transform filters into a query object\n   * @param filters - The filters to transform\n   * @returns Query object with columns and other parameters\n   */\n  getQueryByFilters?: (filters: ChartFilters) => InsightsQuery;\n\n  /**\n   * Function to normalize the raw API response\n   * @param responseData - Raw response from the API\n   * @returns Normalized data for the chart\n   */\n  normalizeRawResponse?: (responseData: RawInsightsResponse) => any;\n}\n\n/**\n * Default implementation of getQueryByFilters\n */\nexport const defaultGetQueryByFilters = (filters: ChartFilters): InsightsQuery => {\n  return {\n    columns: ['*'],\n    ...filters,\n  };\n};\n\n/**\n * Default implementation of normalizeRawResponse\n */\nexport const defaultNormalizeRawResponse = (responseData: RawInsightsResponse): any => {\n  return responseData.data || responseData;\n};\n","import { Prop, State } from '@stencil/core';\nimport { ChartFilters, InsightsQuery, RawInsightsResponse, defaultGetQueryByFilters, defaultNormalizeRawResponse } from '../utils/chart-types';\n\n/**\n * Base class for all Insights chart components\n * Provides common functionality for data fetching and normalization\n *\n * Note: Chart components should find their parent insights-wrapper element\n * and use the wrapper's fetchData() method to access the client.\n */\nexport class InsightsChartBase<DataItemArray = any, ApolloDataSpecification = any> {\n  /**\n   * Reference to the host element\n   */\n  declare el: HTMLElement;\n\n  /**\n   * Name of the report to fetch data from\n   */\n  @Prop() reportName!: string;\n\n  /**\n   * Filters to apply to the query\n   */\n  @Prop() filters?: ChartFilters;\n\n  /**\n   * Function to transform filters into a query object\n   */\n  @Prop() getQueryByFilters?: (filters: ChartFilters) => InsightsQuery;\n\n  /**\n   * Function to normalize the raw API response\n   */\n  @Prop() normalizeRawResponse?: (responseData: RawInsightsResponse) => DataItemArray;\n\n  /**\n   * Optional specification object for customizing the chart appearance\n   */\n  @Prop() spec?: ApolloDataSpecification;\n\n  /**\n   * Loading state\n   */\n  @State() loading: boolean = false;\n\n  /**\n   * Chart data\n   */\n  @State() data: DataItemArray | null = null;\n\n  /**\n   * Error state\n   */\n  @State() error: string | null = null;\n\n  /**\n   * Fetch chart data from the Insights API via parent wrapper\n   */\n  protected async fetchChartData(): Promise<void> {\n    this.loading = true;\n    this.error = null;\n\n    try {\n      // Find parent insights-wrapper\n      const wrapper = this.el?.closest('insights-wrapper') as any;\n      if (!wrapper) {\n        return null;\n        // throw new Error('Chart component must be used inside <insights-wrapper>');\n      }\n\n      // Build query using provided function or default\n      const queryBuilder = this.getQueryByFilters || defaultGetQueryByFilters;\n      const query = queryBuilder(this.filters || {});\n\n      // Fetch raw data through wrapper\n      const response = await wrapper.fetchData(this.reportName, query);\n\n      // Normalize response using provided function or default\n      if (this.normalizeRawResponse) {\n        this.data = this.normalizeRawResponse(response);\n      } else {\n        const normalizer = defaultNormalizeRawResponse;\n        this.data = normalizer(response);\n      }\n      this.loading = false;\n    } catch (err) {\n      this.error = err.message || 'Failed to fetch chart data';\n      this.loading = false;\n      console.error('Error fetching chart data:', err);\n    }\n  }\n\n  /**\n   * Refresh the chart data\n   */\n  async refresh(): Promise<void> {\n    await this.fetchChartData();\n  }\n}\n"],"names":[],"mappings":";;AAoDA;;AAEG;AACI,MAAM,wBAAwB,GAAG,CAAC,OAAqB,KAAmB;IAC/E,OAAO;QACL,OAAO,EAAE,CAAC,GAAG,CAAC;AACd,QAAA,GAAG,OAAO;KACX;AACH,CAAC;AAED;;AAEG;AACI,MAAM,2BAA2B,GAAG,CAAC,YAAiC,KAAS;AACpF,IAAA,OAAO,YAAY,CAAC,IAAI,IAAI,YAAY;AAC1C,CAAC;;MCzDY,iBAAiB,GAAA,MAAA;;;;AAM5B;;AAEG;AACK,IAAA,UAAU;AAElB;;AAEG;AACK,IAAA,OAAO;AAEf;;AAEG;AACK,IAAA,iBAAiB;AAEzB;;AAEG;AACK,IAAA,oBAAoB;AAE5B;;AAEG;AACK,IAAA,IAAI;AAEZ;;AAEG;IACM,OAAO,GAAY,KAAK;AAEjC;;AAEG;IACM,IAAI,GAAyB,IAAI;AAE1C;;AAEG;IACM,KAAK,GAAkB,IAAI;AAEpC;;AAEG;AACO,IAAA,MAAM,cAAc,GAAA;AAC5B,QAAA,IAAI,CAAC,OAAO,GAAG,IAAI;AACnB,QAAA,IAAI,CAAC,KAAK,GAAG,IAAI;AAEjB,QAAA,IAAI;;YAEF,MAAM,OAAO,GAAG,IAAI,CAAC,EAAE,EAAE,OAAO,CAAC,kBAAkB,CAAQ;YAC3D,IAAI,CAAC,OAAO,EAAE;AACZ,gBAAA,OAAO,IAAI;;;;AAKb,YAAA,MAAM,YAAY,GAAG,IAAI,CAAC,iBAAiB,IAAI,wBAAwB;YACvE,MAAM,KAAK,GAAG,YAAY,CAAC,IAAI,CAAC,OAAO,IAAI,EAAE,CAAC;;AAG9C,YAAA,MAAM,QAAQ,GAAG,MAAM,OAAO,CAAC,SAAS,CAAC,IAAI,CAAC,UAAU,EAAE,KAAK,CAAC;;AAGhE,YAAA,IAAI,IAAI,CAAC,oBAAoB,EAAE;gBAC7B,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,oBAAoB,CAAC,QAAQ,CAAC;;iBAC1C;gBACL,MAAM,UAAU,GAAG,2BAA2B;AAC9C,gBAAA,IAAI,CAAC,IAAI,GAAG,UAAU,CAAC,QAAQ,CAAC;;AAElC,YAAA,IAAI,CAAC,OAAO,GAAG,KAAK;;QACpB,OAAO,GAAG,EAAE;YACZ,IAAI,CAAC,KAAK,GAAG,GAAG,CAAC,OAAO,IAAI,4BAA4B;AACxD,YAAA,IAAI,CAAC,OAAO,GAAG,KAAK;AACpB,YAAA,OAAO,CAAC,KAAK,CAAC,4BAA4B,EAAE,GAAG,CAAC;;;AAIpD;;AAEG;AACH,IAAA,MAAM,OAAO,GAAA;AACX,QAAA,MAAM,IAAI,CAAC,cAAc,EAAE;;;;;;"}

package/dist/esm/insights-donut-chart.entry.js

@@ -0,0 +1,40 @@
+import { r as registerInstance, g as getElement, h } from './index-BAqvP5--.js';
+import { I as InsightsChartBase } from './insights-chart-base-uNbdsloe.js';
+
+const insightsDonutChartCss = ":host{display:block}.insights-donut-chart{width:100%;height:100%;min-height:300px;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:300px}.spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #3498db;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.loading-container p{margin-top:16px;color:#666}.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:300px;padding:20px}.error-message{color:#e74c3c;margin-bottom:16px;text-align:center}.error-container button{padding:8px 16px;background-color:#3498db;color:white;border:none;border-radius:4px;cursor:pointer;font-size:14px}.error-container button:hover{background-color:#2980b9}.chart-container{width:100%;height:100%;padding:20px}.no-data{display:flex;align-items:center;justify-content:center;height:100%;min-height:300px;color:#999}";
+
+const InsightsDonutChart = class extends InsightsChartBase {
+    constructor(hostRef) {
+        super();
+        registerInstance(this, hostRef);
+    }
+    get el() { return getElement(this); }
+    componentWillLoad() {
+        this.fetchChartData();
+    }
+    handlePropsChange() {
+        this.fetchChartData();
+    }
+    renderChart() {
+        if (!this.data || this.data.length === 0) {
+            return h("div", { class: "no-data" }, "No data available");
+        }
+        return (h("div", { class: "chart-container" }, h("apollo-data-donut-chart", { ref: el => {
+                if (el) {
+                    el.adData = this.data;
+                    el.adSpec = this.spec || {};
+                }
+            } })));
+    }
+    render() {
+        return (h("div", { key: 'b459affa996f96b3d3c6d3be1b434bfd3bf9a434', class: "insights-donut-chart" }, this.loading && (h("div", { key: 'd657d9c5561521a87e9c89e53604f2f29d4ee672', class: "loading-container" }, h("div", { key: '4bba1ebc4c1ff611c156c89ca172f8a5962c22df', class: "spinner" }), h("p", { key: 'c769618075a47539d7e00c0d88951e9ec230211b' }, "Loading chart data..."))), this.error && (h("div", { key: '4d7222db52e39e475e865d5dd82f800d87f80f6c', class: "error-container" }, h("p", { key: 'a56ae48922b31cd0fe23b682580e05eafd052288', class: "error-message" }, this.error), h("button", { key: '0cd6d156f31fcddc624b1332d012a59f7f265092', onClick: () => this.fetchChartData() }, "Retry"))), !this.loading && !this.error && this.renderChart()));
+    }
+    static get watchers() { return {
+        "reportName": ["handlePropsChange"],
+        "filters": ["handlePropsChange"]
+    }; }
+};
+InsightsDonutChart.style = insightsDonutChartCss;
+
+export { InsightsDonutChart as insights_donut_chart };
+//# sourceMappingURL=insights-donut-chart.entry.js.map

package/dist/esm/insights-donut-chart.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"insights-donut-chart.entry.js","sources":["src/components/insights-donut-chart/insights-donut-chart.css?tag=insights-donut-chart&encapsulation=shadow","src/components/insights-donut-chart/insights-donut-chart.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.insights-donut-chart {\n  width: 100%;\n  height: 100%;\n  min-height: 300px;\n  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;\n}\n\n.loading-container {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  min-height: 300px;\n}\n\n.spinner {\n  width: 40px;\n  height: 40px;\n  border: 4px solid #f3f3f3;\n  border-top: 4px solid #3498db;\n  border-radius: 50%;\n  animation: spin 1s linear infinite;\n}\n\n@keyframes spin {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\n.loading-container p {\n  margin-top: 16px;\n  color: #666;\n}\n\n.error-container {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  min-height: 300px;\n  padding: 20px;\n}\n\n.error-message {\n  color: #e74c3c;\n  margin-bottom: 16px;\n  text-align: center;\n}\n\n.error-container button {\n  padding: 8px 16px;\n  background-color: #3498db;\n  color: white;\n  border: none;\n  border-radius: 4px;\n  cursor: pointer;\n  font-size: 14px;\n}\n\n.error-container button:hover {\n  background-color: #2980b9;\n}\n\n.chart-container {\n  width: 100%;\n  height: 100%;\n  padding: 20px;\n}\n\n.no-data {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  min-height: 300px;\n  color: #999;\n}\n","import { Component, h, Watch, Element } from '@stencil/core';\nimport type { DonutDataItem, DonutSpec } from '@xplortech/apollo-data/dist/types/components.d.ts';\nimport { InsightsChartBase } from '../insights-chart-base';\n\n@Component({\n  tag: 'insights-donut-chart',\n  styleUrl: 'insights-donut-chart.css',\n  shadow: true,\n})\nexport class InsightsDonutChart extends InsightsChartBase<DonutDataItem[], DonutSpec> {\n  @Element() el: HTMLElement = null;\n\n  componentWillLoad() {\n    this.fetchChartData();\n  }\n\n  @Watch('reportName')\n  @Watch('filters')\n  handlePropsChange() {\n    this.fetchChartData();\n  }\n\n  private renderChart() {\n    if (!this.data || this.data.length === 0) {\n      return <div class=\"no-data\">No data available</div>;\n    }\n\n    return (\n      <div class=\"chart-container\">\n        <apollo-data-donut-chart\n          ref={el => {\n            if (el) {\n              el.adData = this.data;\n              el.adSpec = this.spec || {};\n            }\n          }}\n        />\n      </div>\n    );\n  }\n\n  render() {\n    return (\n      <div class=\"insights-donut-chart\">\n        {this.loading && (\n          <div class=\"loading-container\">\n            <div class=\"spinner\"></div>\n            <p>Loading chart data...</p>\n          </div>\n        )}\n\n        {this.error && (\n          <div class=\"error-container\">\n            <p class=\"error-message\">{this.error}</p>\n            <button onClick={() => this.fetchChartData()}>Retry</button>\n          </div>\n        )}\n\n        {!this.loading && !this.error && this.renderChart()}\n      </div>\n    );\n  }\n}\n"],"names":[],"mappings":";;;AAAA,MAAM,qBAAqB,GAAG,0pCAA0pC;;MCS3qC,kBAAmB,GAAA,cAAQ,iBAA6C,CAAA;;;;;;IAGnF,iBAAiB,GAAA;QACf,IAAI,CAAC,cAAc,EAAE;;IAKvB,iBAAiB,GAAA;QACf,IAAI,CAAC,cAAc,EAAE;;IAGf,WAAW,GAAA;AACjB,QAAA,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,CAAC,MAAM,KAAK,CAAC,EAAE;AACxC,YAAA,OAAO,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,SAAS,wBAAwB;;QAGrD,QACE,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,iBAAiB,EAAA,EAC1B,CAAA,CAAA,yBAAA,EAAA,EACE,GAAG,EAAE,EAAE,IAAG;gBACR,IAAI,EAAE,EAAE;AACN,oBAAA,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,IAAI;oBACrB,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,IAAI,IAAI,EAAE;;AAE/B,aAAC,EAAA,CACD,CACE;;IAIV,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,sBAAsB,EAAA,EAC9B,IAAI,CAAC,OAAO,KACX,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,mBAAmB,EAAA,EAC5B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAO,CAAA,EAC3B,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAA,uBAAA,CAA4B,CACxB,CACP,EAEA,IAAI,CAAC,KAAK,KACT,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,iBAAiB,EAAA,EAC1B,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,KAAK,EAAC,eAAe,IAAE,IAAI,CAAC,KAAK,CAAK,EACzC,CAAQ,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAE,MAAM,IAAI,CAAC,cAAc,EAAE,EAAgB,EAAA,OAAA,CAAA,CACxD,CACP,EAEA,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,WAAW,EAAE,CAC/C;;;;;;;;;;;"}

package/dist/esm/insights-elements.js

@@ -0,0 +1,22 @@
+import { p as promiseResolve, b as bootstrapLazy } from './index-BAqvP5--.js';
+export { s as setNonce } from './index-BAqvP5--.js';
+import { g as globalScripts } from './app-globals-BtE_P06_.js';
+
+/*
+ Stencil Client Patch Browser v4.38.3 | MIT Licensed | https://stenciljs.com
+ */
+
+var patchBrowser = () => {
+  const importMeta = import.meta.url;
+  const opts = {};
+  if (importMeta !== "") {
+    opts.resourcesUrl = new URL(".", importMeta).href;
+  }
+  return promiseResolve(opts);
+};
+
+patchBrowser().then(async (options) => {
+  await globalScripts();
+  return bootstrapLazy([["insights-bar-chart",[[769,"insights-bar-chart",{"reportName":[1,"report-name"],"filters":[16],"getQueryByFilters":[16],"normalizeRawResponse":[16],"spec":[16],"loading":[32],"data":[32],"error":[32]},null,{"reportName":["handlePropsChange"],"filters":["handlePropsChange"]}]]],["insights-donut-chart",[[769,"insights-donut-chart",{"reportName":[1,"report-name"],"filters":[16],"getQueryByFilters":[16],"normalizeRawResponse":[16],"spec":[16],"loading":[32],"data":[32],"error":[32]},null,{"reportName":["handlePropsChange"],"filters":["handlePropsChange"]}]]],["insights-wrapper",[[769,"insights-wrapper",{"configName":[1,"config-name"],"apiUrl":[1,"api-url"],"token":[1],"onRefreshTokenCallback":[16],"onEventEmittedCallback":[16],"initialized":[32],"fetchData":[64],"buildQuery":[64],"manualRefreshToken":[64]},null,{"configName":["handlePropsChange"],"apiUrl":["handlePropsChange"],"token":["handlePropsChange"],"onRefreshTokenCallback":["handlePropsChange"],"onEventEmittedCallback":["handlePropsChange"]}]]]], options);
+});
+//# sourceMappingURL=insights-elements.js.map

package/dist/esm/insights-elements.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"insights-elements.js","sources":["../../node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.38.3 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, H, promiseResolve, win } from \"@stencil/core\";\nvar patchBrowser = () => {\n  if (BUILD.isDev && !BUILD.isTesting) {\n    consoleDevInfo(\"Running in development mode.\");\n  }\n  if (BUILD.cloneNodeFix) {\n    patchCloneNodeFix(H.prototype);\n  }\n  const scriptElm = BUILD.scriptDataOpts ? win.document && Array.from(win.document.querySelectorAll(\"script\")).find(\n    (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n  ) : null;\n  const importMeta = import.meta.url;\n  const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n  if (importMeta !== \"\") {\n    opts.resourcesUrl = new URL(\".\", importMeta).href;\n  }\n  return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n  const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n  HTMLElementPrototype.cloneNode = function(deep) {\n    if (this.nodeName === \"TEMPLATE\") {\n      return nativeCloneNodeFn.call(this, deep);\n    }\n    const clonedNode = nativeCloneNodeFn.call(this, false);\n    const srcChildNodes = this.childNodes;\n    if (deep) {\n      for (let i = 0; i < srcChildNodes.length; i++) {\n        if (srcChildNodes[i].nodeType !== 2) {\n          clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n        }\n      }\n    }\n    return clonedNode;\n  };\n};\nexport {\n  patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"names":[],"mappings":";;;;AAAA;AACA;AACA;;AAKA,IAAI,YAAY,GAAG,MAAM;AAUzB,EAAE,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG;AACpC,EAAE,MAAM,IAAI,GAAiE,EAAE;AAC/E,EAAE,IAAI,UAAU,KAAK,EAAE,EAAE;AACzB,IAAI,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI;AACrD;AACA,EAAE,OAAO,cAAc,CAAC,IAAI,CAAC;AAC7B,CAAC;;ACnBD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,OAAO,KAAK;AACvC,EAAE,MAAM,aAAa,EAAE;AACvB,EAAE,OAAO,aAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC;AAC7D,CAAC,CAAC","x_google_ignoreList":[0]}