@heartlandone/vega 2.0.0-temp-test-0.3 → 2.0.0

package/dist/esm/vega-line-chart.entry.js

@@ -0,0 +1,372 @@
+import { r as registerInstance, h, g as getElement, H as Host } from './index-c3505689.js';
+import { B as BaseDrawer, a as BaseChart, L as LayoutInputProcessor, P as ProcessorChain, b as LegendInputProcessor, c as LegendDrawer } from './legendInputProcessor-73659534.js';
+import { t as timeParse, a as timeFormat, s as second, b as timeMinute, c as timeHour, d as timeDay, e as timeMonth, f as timeSunday, g as timeYear, X as XAxisInputProcessor, Y as YAxisInputProcessor, h as XAxisDrawer, i as YAxisDrawer } from './yAxisInputProcessor-e30d7e4c.js';
+import { f as flatNestedArray, c as convertArrayToNestedArray, s as sortAsExistArray, a as sortArrayOrNestedArray } from './array-e1522673.js';
+import { s as sanitizeVegaComponent } from './component-e4eb3f14.js';
+import './global-slimmer-registry-b91c742d.js';
+import { I as InjectVegaGlobalSlimmer } from './inject-vega-global-slimmer-c3f84156.js';
+import './typography-03d285b4.js';
+import './number-400b3bf2.js';
+import './log-a824be80.js';
+
+function map(values, mapper) {
+  if (typeof values[Symbol.iterator] !== "function") throw new TypeError("values is not iterable");
+  if (typeof mapper !== "function") throw new TypeError("mapper is not a function");
+  return Array.from(values, (value, index) => mapper(value, index, values));
+}
+
+/** The PathDrawer class draws a path on a chart using provided data and color options. */
+class PathDrawer extends BaseDrawer {
+  /** This function adds interaction support */
+  // eslint-disable-next-line @typescript-eslint/no-empty-function
+  addInteractionSupport() { }
+  /**
+   * This function draws a path on a chart using specified options.
+   */
+  draw() {
+    const { positions, colors } = this.options.renderOptions;
+    let renderPositions = positions;
+    if (positions && positions[0] && !Array.isArray(positions[0])) {
+      renderPositions = [positions];
+    }
+    renderPositions.forEach((item, index) => {
+      const color = this.getColorByIndex(index, colors);
+      this.renderer.drawLinePath(item, this.getColorFromToken(color));
+      item.forEach((position) => {
+        this.renderer.drawCircle(position, 4, this.getColorFromToken('bg-primary'), 2, this.getColorFromToken(color));
+      });
+    });
+  }
+}
+
+/** The `LinePathInputProcessor` class generates chart path options based on input data and previous scale records for a line chart. */
+class LinePathInputProcessor {
+  /**
+   * This function generates chart path options based on input data and previous scale records.
+   *
+   * @param {ChartOptions<LineChartDataType>} input - The input parameter is an object of type ChartOptions that contains two properties:
+   * dataSource and colors. The dataSource property is of type LineChartDataType and represents the data
+   * used to generate the chart. The colors property is an array of strings that represents the colors
+   * to be used for the chart.
+   * @param {ScaleRecordType} previousOutput - The `previousOutput` parameter is of type
+   * `ScaleRecordType` and is the output of the previous step in the chart rendering process. It
+   * contains the x and y scales that were calculated in the previous step and are used in this step to
+   * generate the positions for the chart path.
+   * @returns {ChartPathOptions} A `ChartPathOptions` object is being returned, which contains an array of `positions`
+   * generated using the `pathPositionGenerator` and the `xScale` and `yScale` scales from the
+   * `previousOutput`, as well as the `colors` from the `dataSource`.
+   */
+  process(input, previousOutput) {
+    const { dataSource, colors } = input;
+    const { xScale, yScale } = previousOutput;
+    return {
+      positions: this.getPathPositions(dataSource, xScale, yScale),
+      colors,
+    };
+  }
+  /**
+   * convert array to array[], convert x,y position to relative position
+   *
+   * @param {LineChartDataType['dataSource']} originData origin line data source
+   * @param {AxisScale<AxisDomain>} xScale x scale
+   * @param {AxisScale<AxisDomain>} yScale y scale
+   * @returns {ChartPosition[][]} x,y relative position
+   */
+  getPathPositions(originData, xScale, yScale) {
+    const flatData = flatNestedArray(originData);
+    let dataLengthArr = [];
+    const flatPathData = flatData.map(({ x, y }) => {
+      return {
+        x: xScale(x),
+        y: yScale(y),
+      };
+    });
+    let pathData = [];
+    if (originData && Array.isArray(originData[0])) {
+      dataLengthArr = originData.map((item) => item.length);
+      pathData = convertArrayToNestedArray(flatPathData, dataLengthArr);
+    }
+    else {
+      pathData = [flatPathData];
+    }
+    return pathData;
+  }
+}
+
+/** The FormatTimePositionsInputProcessor class processes input data for a line chart by formatting time positions if the x-axis type is 'time'. */
+class FormatTimePositionsInputProcessor {
+  /**
+   * This function processes chart options for a line chart, converting the x-axis data to a time format if necessary.
+   *
+   * @param {ChartOptions<LineChartDataType>} input - A ChartOptions object that contains the data source and configuration options for a line chart.
+   * @returns {ChartOptions<LineChartDataType>} A modified version of the input ChartOptions object with the dataSource property
+   * potentially transformed based on the xAxis type.
+   */
+  process(input) {
+    const { dataSource, xAxis } = input;
+    const xAxisType = (xAxis === null || xAxis === void 0 ? void 0 : xAxis.type) || 'value';
+    let renderData = dataSource;
+    if (xAxisType === 'time') {
+      renderData = this.formatTimePositionArray(dataSource);
+    }
+    input.dataSource = renderData;
+    return input;
+  }
+  /**
+   * format date position array function for chart, parse date string yyyy-MM-DD to date
+   *
+   * @param {StringCategorizedChartData[] | StringCategorizedChartData[][]} data data source
+   * @returns {DateCategorizedChartData[] | DateCategorizedChartData[][]} result array
+   */
+  formatTimePositionArray(data) {
+    let result = [];
+    let lengthArray = [];
+    const flatArray = flatNestedArray(data);
+    const flatArray_date = map(flatArray, (d) => {
+      return { x: typeof d.x === 'string' ? timeParse('%Y-%m-%d')(d.x) : d.x, y: d.y };
+    });
+    if (data && Array.isArray(data[0])) {
+      lengthArray = data.map((item) => item.length);
+      result = convertArrayToNestedArray(flatArray_date, lengthArray);
+    }
+    else {
+      result = flatArray_date;
+    }
+    return result;
+  }
+}
+
+/** The SortPositionsInputProcessor class sorts the data source of a line chart based on the type of x-axis. */
+class SortPositionsInputProcessor {
+  /**
+   * This function sorts the data source of a line chart based on the type of x-axis.
+   *
+   * @param {ChartOptions<LineChartDataType>} input - The input parameter is an object of type ChartOptions with a generic type of
+   * LineChartDataType. It contains the data source and configuration options for a line chart,
+   * including the x-axis type.
+   * @returns {ChartOptions<LineChartDataType>} a modified version of the input `ChartOptions` object with the `dataSource` property
+   * sorted based on the `xAxis` type. The modified `ChartOptions` object is of type
+   * `ChartOptions<LineChartDataType>`.
+   */
+  process(input) {
+    const { dataSource, xAxis } = input;
+    const xAxisType = (xAxis === null || xAxis === void 0 ? void 0 : xAxis.type) || 'value';
+    let renderData = dataSource;
+    switch (xAxisType) {
+      case 'time':
+        renderData = sortArrayOrNestedArray(dataSource, (data) => data.x.valueOf());
+        break;
+      case 'value':
+        renderData = sortArrayOrNestedArray(dataSource, (data) => data.x);
+        break;
+      case 'category':
+        renderData = sortAsExistArray(dataSource, (item) => item.x, xAxis.sorter);
+    }
+    input.dataSource = renderData;
+    return input;
+  }
+}
+
+/** The XAxisInputProcessor class generates X-axis options for a line chart based on input data and previous layout results. */
+class XAxisLabelFormatterInputProcessor {
+  constructor() {
+    this.formatMillisecond = timeFormat('.%L');
+    this.formatSecond = timeFormat(':%S');
+    this.formatMinute = timeFormat('%I:%M');
+    //return 18:00
+    this.formatHour = timeFormat('%H:00');
+    //return 01
+    this.formatDay = timeFormat('%d');
+    //return Jan 01
+    this.formatWeek = timeFormat('%b %d');
+    //return Jan
+    this.formatMonth = timeFormat('%b');
+    //return 2023
+    this.formatYear = timeFormat('%Y');
+  }
+  /**
+   * This function checks if the xAxis type is 'time' and sets a tickFormat if a labelFormatter is not provided.
+   *
+   * @param {ChartOptions<unknown>} input - An object containing chart options, including the type of x-axis and a label
+   * formatter function.
+   * @param {ChartExtend<AxisScale<AxisDomain>>} previousOutput - `previousOutput` is a parameter that represents the output of the previous
+   * step in the charting process. It is of type `ChartExtend<AxisScale<AxisDomain>>`, which is an
+   * object that contains information about the chart's axis scales. This parameter is used to update
+   * the axis scale information
+   * @returns {ChartExtend<AxisScale<AxisDomain>>} a `ChartExtend` object that contains an `AxisScale` object with a tick format function.
+   * The tick format function is either the `timeFormatter` function or the previous tick format
+   * function if the `xAxisType` is not `'time'`.
+   */
+  process(input, previousOutput) {
+    const { xAxis } = input;
+    const xAxisType = (xAxis === null || xAxis === void 0 ? void 0 : xAxis.type) || 'value';
+    if (xAxisType === 'time' && typeof previousOutput.labelFormatter !== 'function') {
+      // eslint-disable-next-line jsdoc/require-jsdoc
+      previousOutput.scale['tickFormat'] = () => this.timeFormatter.bind(this);
+    }
+    return previousOutput;
+  }
+  /**
+   * override the scaleTime default ticks label formatter function
+   * The function formats a given date object based on its time interval using a set of predefined format strings.
+   *
+   * @param {Date} date - The input date that needs to be formatted.
+   * @returns {string} A string representing the formatted date based on the input date parameter. The format of
+   * the string depends on the time interval between the input date and the current time, and is
+   * determined by the conditional statements in the function.
+   */
+  timeFormatter(date) {
+    return (second(date) < date
+      ? this.formatMillisecond
+      : timeMinute(date) < date
+        ? this.formatSecond
+        : timeHour(date) < date
+          ? this.formatMinute
+          : timeDay(date) < date
+            ? this.formatHour
+            : timeMonth(date) < date
+              ? timeSunday(date) < date
+                ? this.formatDay
+                : this.formatWeek
+              : timeYear(date) < date
+                ? this.formatMonth
+                : this.formatYear)(date);
+  }
+}
+
+/**
+ * The LineChart class is a TypeScript implementation of a line chart that extends the BaseChart class
+ * and includes methods for creating a drawer chain
+ */
+class LineChart extends BaseChart {
+  constructor() {
+    super(...arguments);
+    this.layoutInputProcessor = new LayoutInputProcessor();
+    this.lineDataSourceInputProcessorChain = new ProcessorChain([new FormatTimePositionsInputProcessor(), new SortPositionsInputProcessor()]);
+    this.xAxisInputProcessorChain = new ProcessorChain([
+      this.layoutInputProcessor,
+      new XAxisInputProcessor(),
+      new XAxisLabelFormatterInputProcessor(),
+    ]);
+    this.yAxisInputProcessorChain = new ProcessorChain([this.layoutInputProcessor, new YAxisInputProcessor()]);
+    this.legendInputProcessorChain = new ProcessorChain([
+      this.layoutInputProcessor,
+      new LegendInputProcessor(),
+    ]);
+    this.linePathInputProcessor = new LinePathInputProcessor();
+  }
+  /**
+   * This function creates an array of BaseDrawer objects for rendering a chart with axes, legends, and paths.
+   *
+   * @param {BaseRenderer<SVGElement | HTMLCanvasElement>} renderer - an instance of a BaseRenderer class that can render SVG or Canvas elements.
+   * @param {BaseInteractor<SVGElement | HTMLCanvasElement>} interactor - an instance of a BaseInteractor class.
+   * @returns {BaseDrawer<unknown>[]} An array of BaseDrawer array.
+   */
+  createDrawerChain(renderer, interactor) {
+    const lineRenderOptionsOutput = this.lineDataSourceInputProcessorChain.process(this.options);
+    const xAxisOutput = this.xAxisInputProcessorChain.process(lineRenderOptionsOutput);
+    const yAxisOutput = this.yAxisInputProcessorChain.process(lineRenderOptionsOutput);
+    return [
+      new XAxisDrawer(renderer, interactor, {
+        renderOptions: xAxisOutput,
+      }),
+      new YAxisDrawer(renderer, interactor, {
+        renderOptions: yAxisOutput,
+      }),
+      new LegendDrawer(renderer, interactor, {
+        renderOptions: this.legendInputProcessorChain.process(this.options),
+      }),
+      new PathDrawer(renderer, interactor, {
+        renderOptions: this.linePathInputProcessor.process(lineRenderOptionsOutput, {
+          xScale: xAxisOutput.scale,
+          yScale: yAxisOutput.scale,
+        }),
+      }),
+    ];
+  }
+}
+
+const vegaLineChartCss = ".vega-chart-legend-item{cursor:pointer}.vega-chart-line-path:hover{stroke-width:5}:host{display:block}";
+
+var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+    r = Reflect.decorate(decorators, target, key, desc);
+  else
+    for (var i = decorators.length - 1; i >= 0; i--)
+      if (d = decorators[i])
+        r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __rest = (undefined && undefined.__rest) || function (s, e) {
+  var t = {};
+  for (var p in s)
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+      t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function")
+    for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+      if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+        t[p[i]] = s[p[i]];
+    }
+  return t;
+};
+const VegaLineChart = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.globalSlimmers = {};
+  }
+  watchOptionsHandel(options) {
+    this.updateChart(options);
+  }
+  disconnectedCallback() {
+    this.chart = null;
+    this.reRenderTimer && clearTimeout(this.reRenderTimer);
+  }
+  componentWillLoad() {
+    this.updateChart(this.options);
+  }
+  /**
+   * Invoke this method to render the chart using the existing options.
+   *    If the chart is displayed incorrectly within a modal or tab,
+   *    ensure that this method is invoked after the chart is shown
+   *    to ensure proper rendering.
+   */
+  async reRender() {
+    this.reRenderTimer && clearTimeout(this.reRenderTimer);
+    /* istanbul ignore next */
+    this.reRenderTimer = setTimeout(() => {
+      this.chart.reRender();
+    }, 0);
+  }
+  render() {
+    return sanitizeVegaComponent(h(Host, null), this.el);
+  }
+  /**
+   * This function draws a line chart using the provided options and data source.
+   *
+   * @param {LineChartOptionsType} options - The options parameter is an object that contains various options for configuring and rendering a line chart.
+   */
+  updateChart(options) {
+    if (!options)
+      return;
+    const { mode = 'svg', dataSource } = options, restOptions = __rest(options, ["mode", "dataSource"]);
+    const mergedOptions = Object.assign(Object.assign({}, restOptions), { mode, container: this.el, dataSource: dataSource || [] });
+    if (this.chart) {
+      this.chart.updateOptions(mergedOptions);
+    }
+    else {
+      this.chart = new LineChart(mergedOptions);
+      this.chart.render();
+    }
+  }
+  get el() { return getElement(this); }
+  static get watchers() { return {
+    "options": ["watchOptionsHandel"]
+  }; }
+};
+__decorate([
+  InjectVegaGlobalSlimmer()
+], VegaLineChart.prototype, "globalSlimmers", void 0);
+VegaLineChart.style = vegaLineChartCss;
+
+export { VegaLineChart as vega_line_chart };

package/dist/esm/{vega-loading-indicator.entry.js → vega-loader-wrapper_2.entry.js}

@@ -1,18 +1,43 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-3e41c219.js';
-import { s as sanitizeVegaComponent } from './component-ff56c5f5.js';
-import { a as arrayToClassString } from './ui-608b4032.js';
-import { R as ResponsiveFormatFacade } from './responsiveFormatFacade-949f8957.js';
-import { g as getCurrentBreakpoint } from './breakpoints-3152fa9c.js';
-import { I as InjectVegaSlimmer } from './global-slimmer-registry-f1dec4a2.js';
-import { I as InjectVegaGlobalSlimmer } from './inject-vega-global-slimmer-0e6dd982.js';
-import { P as PageResizeObserverSlimmer } from './pageResizeObserverSlimmer-ee15d7fd.js';
-import './featureFlagController-5d7e64f1.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-c3505689.js';
+import { I as InjectVegaSlimmer } from './global-slimmer-registry-b91c742d.js';
+import { I as InjectVegaGlobalSlimmer } from './inject-vega-global-slimmer-c3f84156.js';
+import { s as sanitizeVegaComponent } from './component-e4eb3f14.js';
+import { a as arrayToClassString } from './ui-6e5294cb.js';
+import { R as ResponsiveFormatFacade } from './responsiveFormatFacade-e91e14ac.js';
+import { g as getCurrentBreakpoint } from './breakpoints-900a4c99.js';
+import { P as PageResizeObserverSlimmer } from './pageResizeObserverSlimmer-b476bb1f.js';
 import './log-a824be80.js';
-import './typeGuard-b2943363.js';
+import './typeGuard-5e282437.js';
+import './ui-535c5fb3.js';
 import './typography-03d285b4.js';
 import './number-400b3bf2.js';
-import './vega-slimmer-d63e92d9.js';
-import './map-to-component-method-4e36ea1f.js';
+import './vega-slimmer-ce2e45d1.js';
+
+const vegaLoaderWrapperCss = ":host{display:block;display:inline-flex;align-items:center;justify-content:center;top:0px;right:0px;bottom:0px;left:0px;background-color:rgba(var(--v-bg-backdrop-loading, 255, 255, 255, 0.5))}:host(.absolute-wrapper){position:absolute}:host(.fixed-wrapper){width:100%;height:100%;position:fixed}";
+
+var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+    r = Reflect.decorate(decorators, target, key, desc);
+  else
+    for (var i = decorators.length - 1; i >= 0; i--)
+      if (d = decorators[i])
+        r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+const VegaLoaderWrapper = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.globalSlimmers = {};
+  }
+  render() {
+    return (h(Host, { class: "vega-loader-wrapper" }, h("slot", null)));
+  }
+};
+__decorate$1([
+  InjectVegaGlobalSlimmer()
+], VegaLoaderWrapper.prototype, "globalSlimmers", void 0);
+VegaLoaderWrapper.style = vegaLoaderWrapperCss;
 
 const vegaLoadingIndicatorCss = ":host{display:inline-block}:host(.vega-loading-indicator-bar){width:100%}:host(.vega-loading-indicator-indeterminate) .circle-loader{animation:circle-loader-animation 2000ms linear infinite;transform:rotate(-90deg)}:host(.vega-loading-indicator-determinate) .circle-loader{transform:rotate(-180deg)}:host(.vega-loading-indicator-default) .circle-loader{width:48px;height:48px}:host(.vega-loading-indicator-micro) .circle-loader{width:16px;height:16px}:host(.vega-loading-indicator-small) .circle-loader{width:24px;height:24px}:host(.vega-loading-indicator-large) .circle-loader{width:120px;height:120px}:host .circle-loader-track{stroke:rgba(var(--v-bg-loading-track, 229, 239, 255, 1));fill:none;cy:50%;cx:50%}:host .circle-loader-progress-pointer.v-hidden{display:none}:host .circle-loader-progress-pointer,:host .circle-loader-progress{stroke:rgba(var(--v-bg-loading-progress, 153, 192, 255, 1));fill:none;cy:50%;cx:50%}:host(.vega-loading-indicator-status-success) .circle-loader-progress-pointer,:host(.vega-loading-indicator-status-success) .circle-loader-progress{stroke:rgba(var(--v-bg-status-success, 160, 233, 167, 1))}:host(.vega-loading-indicator-status-error) .circle-loader-progress-pointer,:host(.vega-loading-indicator-status-error) .circle-loader-progress{stroke:rgba(var(--v-bg-status-error, 255, 110, 139, 1))}:host(.vega-loading-indicator-default) .circle-loader-progress-pointer,:host(.vega-loading-indicator-default) .circle-loader-track,:host(.vega-loading-indicator-default) .circle-loader-progress{stroke-width:8px}:host .circle-loader-progress-pointer{stroke-linecap:round}:host(.vega-loading-indicator-micro) .circle-loader-progress-pointer,:host(.vega-loading-indicator-micro) .circle-loader-track,:host(.vega-loading-indicator-micro) .circle-loader-progress{stroke-width:3px}:host(.vega-loading-indicator-small) .circle-loader-progress-pointer,:host(.vega-loading-indicator-small) .circle-loader-track,:host(.vega-loading-indicator-small) .circle-loader-progress{stroke-width:4px}:host(.vega-loading-indicator-large) .circle-loader-progress-pointer,:host(.vega-loading-indicator-large) .circle-loader-track,:host(.vega-loading-indicator-large) .circle-loader-progress{stroke-width:16px}@keyframes circle-loader-animation{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host .bar-loader{border-radius:9999px;position:absolute;box-sizing:border-box;height:8px;background-color:rgba(var(--v-bg-loading-progress, 153, 192, 255, 1));content:\"\";width:75%;top:0;left:0}:host(.vega-loading-indicator-status-success) .bar-loader{background-color:rgba(var(--v-bg-status-success, 160, 233, 167, 1))}:host(.vega-loading-indicator-status-error) .bar-loader{background-color:rgba(var(--v-bg-status-error, 255, 110, 139, 1))}:host(.vega-loading-indicator-micro) .bar-loader,:host(.vega-loading-indicator-micro) .bar-loader-track{height:3px}:host(.vega-loading-indicator-small) .bar-loader,:host(.vega-loading-indicator-small) .bar-loader-track{height:4px}:host(.vega-loading-indicator-large) .bar-loader,:host(.vega-loading-indicator-large) .bar-loader-track{height:16px}:host(.vega-loading-indicator-indeterminate) .bar-loader{animation:bar-loader-animation 1250ms cubic-bezier(0.75, 0, 0.5, 1) infinite;animation-delay:50ms}@keyframes bar-loader-animation{0%{left:0;transform:translateX(-100%)}100%{left:100%;transform:translateX(0%)}}:host .bar-loader-track{display:inline-block;border-radius:9999px;position:relative;overflow:hidden;height:8px;width:100%;background-color:rgba(var(--v-bg-loading-track, 229, 239, 255, 1))}:host .vega-loading-indicator-label{font-family:\"Inter\", sans-serif;font-size:18px;font-weight:700;line-height:25px;letter-spacing:0px;color:rgba(var(--v-text-primary, 32, 54, 69, 1))}@media screen and (min-width: 768px) and (max-width: 1023px){:host .vega-loading-indicator-label{font-family:\"Inter\", sans-serif;font-size:18px;font-weight:700;line-height:25px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host .vega-loading-indicator-label{font-family:\"Inter\", sans-serif;font-size:18px;font-weight:700;line-height:25px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host .vega-loading-indicator-label{font-family:\"Inter\", sans-serif;font-size:18px;font-weight:700;line-height:25px;letter-spacing:0px}}:host .vega-loading-indicator-hint{font-family:\"Inter\", sans-serif;font-size:16px;font-weight:400;line-height:24px;letter-spacing:0px;color:rgba(var(--v-text-secondary, 107, 116, 125, 1))}@media screen and (min-width: 768px) and (max-width: 1023px){:host .vega-loading-indicator-hint{font-family:\"Inter\", sans-serif;font-size:16px;font-weight:400;line-height:24px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host .vega-loading-indicator-hint{font-family:\"Inter\", sans-serif;font-size:16px;font-weight:400;line-height:24px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host .vega-loading-indicator-hint{font-family:\"Inter\", sans-serif;font-size:16px;font-weight:400;line-height:24px;letter-spacing:0px}}";
 
@@ -128,4 +153,4 @@ __decorate([
 ], VegaLoadingIndicator.prototype, "pageResizeObserverSlimmer", void 0);
 VegaLoadingIndicator.style = vegaLoadingIndicatorCss;
 
-export { VegaLoadingIndicator as vega_loading_indicator };
+export { VegaLoaderWrapper as vega_loader_wrapper, VegaLoadingIndicator as vega_loading_indicator };

package/dist/esm/{vega-page-notification.entry.js → vega-page-notification_2.entry.js}

@@ -1,15 +1,14 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-3e41c219.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-c3505689.js';
 import { c as createEnterKeyHandlerToTriggerClick } from './accessibility-e5fd0fab.js';
-import { s as sanitizeVegaComponent } from './component-ff56c5f5.js';
-import { g as getDeviceType, D as DeviceType, a as arrayToClassString } from './ui-608b4032.js';
-import './global-slimmer-registry-f1dec4a2.js';
-import { I as InjectVegaGlobalSlimmer } from './inject-vega-global-slimmer-0e6dd982.js';
-import './featureFlagController-5d7e64f1.js';
+import { s as sanitizeVegaComponent } from './component-e4eb3f14.js';
+import { g as getDeviceType, D as DeviceType, a as arrayToClassString } from './ui-6e5294cb.js';
+import './global-slimmer-registry-b91c742d.js';
+import { I as InjectVegaGlobalSlimmer } from './inject-vega-global-slimmer-c3f84156.js';
 import './log-a824be80.js';
 
 const vegaPageNotificationCss = ":host{display:inline-block;padding:24px;box-sizing:border-box;border-radius:12px;max-width:480px;box-shadow:0 4px 8px rgba(2, 2, 15, 0.1), 0 12px 20px rgba(2, 2, 15, 0.15);animation:fade-in-right 300ms ease-in-out}:host(.mobile){width:100%;max-width:100%;padding:16px;animation:fade-in-up 300ms ease-in-out}:host(.vega-page-notification-fade-out){opacity:0;animation:fade-out 300ms ease-in-out}:host vega-icon{color:rgba(var(--v-text-page-notification-content, 32, 54, 69, 1))}:host .vega-page-notification-prefix{display:flex}:host(.mobile) .vega-page-notification-prefix{padding-top:4px}:host .vega-page-notification-content{flex:1 1 0%;overflow:auto}:host .vega-page-notification-close-btn{cursor:pointer;display:inline-flex;margin-top:4px}:host(.mobile) .vega-page-notification-close-btn{padding:2px}:host .vega-page-notification-actions-container{display:flex;align-items:flex-end;flex-wrap:wrap;gap:16px;justify-content:flex-end;margin-top:24px}:host(.mobile) .vega-page-notification-actions-container{margin-top:16px}:host .vega-page-notification-title{color:rgba(var(--v-text-page-notification-content, 32, 54, 69, 1));font-family:\"Inter\", sans-serif;font-size:20px;font-weight:700;line-height:28px;letter-spacing:0px}@media screen and (min-width: 768px) and (max-width: 1023px){:host .vega-page-notification-title{font-family:\"Inter\", sans-serif;font-size:20px;font-weight:700;line-height:28px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host .vega-page-notification-title{font-family:\"Inter\", sans-serif;font-size:20px;font-weight:700;line-height:28px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host .vega-page-notification-title{font-family:\"Inter\", sans-serif;font-size:20px;font-weight:700;line-height:28px;letter-spacing:0px}}:host(.mobile) .vega-page-notification-title{font-family:\"Inter\", sans-serif;font-size:18px;font-weight:700;line-height:25px;letter-spacing:0px;overflow-wrap:break-word}@media screen and (min-width: 768px) and (max-width: 1023px){:host(.mobile) .vega-page-notification-title{font-family:\"Inter\", sans-serif;font-size:18px;font-weight:700;line-height:25px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host(.mobile) .vega-page-notification-title{font-family:\"Inter\", sans-serif;font-size:18px;font-weight:700;line-height:25px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host(.mobile) .vega-page-notification-title{font-family:\"Inter\", sans-serif;font-size:18px;font-weight:700;line-height:25px;letter-spacing:0px}}:host .vega-page-notification-message{color:rgba(var(--v-text-page-notification-content, 32, 54, 69, 1));font-family:\"Inter\", sans-serif;font-size:18px;font-weight:500;line-height:28px;letter-spacing:0px;overflow-wrap:break-word;margin-top:2px}@media screen and (min-width: 768px) and (max-width: 1023px){:host .vega-page-notification-message{font-family:\"Inter\", sans-serif;font-size:16px;font-weight:500;line-height:22px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host .vega-page-notification-message{font-family:\"Inter\", sans-serif;font-size:16px;font-weight:500;line-height:22px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host .vega-page-notification-message{font-family:\"Inter\", sans-serif;font-size:16px;font-weight:500;line-height:22px;letter-spacing:0px}}:host(.mobile) .vega-page-notification-message{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0px}@media screen and (min-width: 768px) and (max-width: 1023px){:host(.mobile) .vega-page-notification-message{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host(.mobile) .vega-page-notification-message{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host(.mobile) .vega-page-notification-message{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:400;line-height:18px;letter-spacing:0px}}:host .vega-page-notification-actions-container vega-button::part(button):hover,:host .vega-page-notification-actions-container vega-button::part(button){font-family:\"Inter\", sans-serif;font-size:18px;font-weight:700;line-height:24px;letter-spacing:0px;background-color:rgba(var(--v-bg-transparent, 0, 0, 0, 0));color:rgba(var(--v-text-page-notification-content, 32, 54, 69, 1));border:2px solid rgba(var(--v-text-page-notification-content, 32, 54, 69, 1))}@media screen and (min-width: 768px) and (max-width: 1023px){:host .vega-page-notification-actions-container vega-button::part(button):hover,:host .vega-page-notification-actions-container vega-button::part(button){font-family:\"Inter\", sans-serif;font-size:16px;font-weight:700;line-height:24px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host .vega-page-notification-actions-container vega-button::part(button):hover,:host .vega-page-notification-actions-container vega-button::part(button){font-family:\"Inter\", sans-serif;font-size:16px;font-weight:700;line-height:24px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host .vega-page-notification-actions-container vega-button::part(button):hover,:host .vega-page-notification-actions-container vega-button::part(button){font-family:\"Inter\", sans-serif;font-size:16px;font-weight:700;line-height:24px;letter-spacing:0px}}:host(.success){background-color:rgba(var(--v-bg-status-success, 160, 233, 167, 1))}:host(.warning){background-color:rgba(var(--v-bg-status-warning, 255, 220, 131, 1))}:host(.error){background-color:rgba(var(--v-bg-status-error, 255, 110, 139, 1))}:host(.info){background-color:rgba(var(--v-bg-status-info, 205, 209, 211, 1))}.vega-page-notification-list{display:flex;flex-direction:column;align-items:flex-end;position:fixed}.vega-page-notification-list-topRight{top:24px;right:24px}.vega-page-notification-list-bottom{left:0px;right:0px;padding-left:16px;padding-right:16px;align-items:center;bottom:0px}@keyframes fade-in-right{from{opacity:0;transform:translateX(100%)}to{opacity:1;transform:none}}@keyframes fade-in-up{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:none}}@keyframes fade-out{from{opacity:1}to{opacity:0}}";
 
-var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
   var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
   if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
     r = Reflect.decorate(decorators, target, key, desc);
@@ -117,9 +116,35 @@ const VegaPageNotification = class {
   }
   get host() { return getElement(this); }
 };
-__decorate([
+__decorate$1([
   InjectVegaGlobalSlimmer()
 ], VegaPageNotification.prototype, "globalSlimmers", void 0);
 VegaPageNotification.style = vegaPageNotificationCss;
 
-export { VegaPageNotification as vega_page_notification };
+const vegaPageNotificationListCss = ":host{position:fixed;display:flex;flex-direction:column;align-items:flex-end}:host(.vega-page-notification-list-topRight){top:24px;right:24px}:host(.vega-page-notification-list-bottom){align-items:center;padding-left:16px;padding-right:16px;left:0px;right:0px;bottom:0px}";
+
+var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+    r = Reflect.decorate(decorators, target, key, desc);
+  else
+    for (var i = decorators.length - 1; i >= 0; i--)
+      if (d = decorators[i])
+        r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+const VegaPageNotificationList = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.globalSlimmers = {};
+  }
+  render() {
+    return (h(Host, null, h("slot", null)));
+  }
+};
+__decorate([
+  InjectVegaGlobalSlimmer()
+], VegaPageNotificationList.prototype, "globalSlimmers", void 0);
+VegaPageNotificationList.style = vegaPageNotificationListCss;
+
+export { VegaPageNotification as vega_page_notification, VegaPageNotificationList as vega_page_notification_list };

package/dist/esm/vega-pagination.entry.js

@@ -1,21 +1,16 @@
-import { h, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-3e41c219.js';
-import { s as sanitizeVegaComponent } from './component-ff56c5f5.js';
+import { h, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-c3505689.js';
+import { s as sanitizeVegaComponent } from './component-e4eb3f14.js';
 import { n as normalizeNumberByRanger, c as convertToNumber } from './number-400b3bf2.js';
-import { D as DomNodeSubjectObserverFactory } from './domNodeSubjectObserverFactory-8aeac4b6.js';
-import { k as VegaFormSubmit, q as VegaBlur, d as VegaChange, a as VegaClick, w as VegaPageSizeChange } from './vegaEventId-78665c18.js';
-import { a as arrayToClassString } from './ui-608b4032.js';
-import { C as ChildNodesEventPreventSlimmer } from './childNodesEventPreventSlimmer-7229b70d.js';
-import { c as createEventEmitSlimmer } from './eventEmitSlimmer-da1fd54e.js';
-import { I as InjectVegaSlimmer } from './global-slimmer-registry-f1dec4a2.js';
-import { I as InjectVegaGlobalSlimmer } from './inject-vega-global-slimmer-0e6dd982.js';
-import './featureFlagController-5d7e64f1.js';
+import { D as DomNodeSubjectObserverFactory, c as createEventEmitSlimmer } from './eventEmitSlimmer-d605ac81.js';
+import { k as VegaFormSubmit, q as VegaBlur, g as VegaChange, V as VegaClick, t as VegaPageSizeChange } from './internalVegaEventManager-efa77ebb.js';
+import { a as arrayToClassString } from './ui-6e5294cb.js';
+import { C as ChildNodesEventPreventSlimmer } from './childNodesEventPreventSlimmer-65a53b20.js';
+import { I as InjectVegaSlimmer } from './global-slimmer-registry-b91c742d.js';
+import { I as InjectVegaGlobalSlimmer } from './inject-vega-global-slimmer-c3f84156.js';
 import './log-a824be80.js';
+import './vega-slimmer-ce2e45d1.js';
+import './dynamic-slimmer-c8ad78de.js';
 import './changeManager-935d420b.js';
-import './observer-3959f9dd.js';
-import './vega-slimmer-d63e92d9.js';
-import './map-to-component-method-4e36ea1f.js';
-import './internalVegaEventManager-4ab886bc.js';
-import './dynamic-slimmer-16826d2b.js';
 
 const VegaPaginationCurrentPageLabel = ({ pageSize, current, total, }) => {
   const rangeFrom = total > 0 ? pageSize * (current - 1) + 1 : 0;
@@ -40,7 +35,7 @@ const VegaPaginationGoTo = ({ onChange, pageCount, }) => {
     h("vega-form", { 
       /* eslint-disable-next-line react/jsx-no-bind */
       ref: (ref) => {
-        DomNodeSubjectObserverFactory.addObserverToNode(ref, VegaFormSubmit, handleChange);
+        DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaFormSubmit, handleChange);
       } },
       h("vega-input", { "data-vega-form": "paginationGoTo", type: "number", size: "small", showClearIcon: false, style: { width: '60px' }, maskConfig: {
           type: 'number',
@@ -56,7 +51,7 @@ const VegaPaginationGoTo = ({ onChange, pageCount, }) => {
         /* eslint-disable-next-line react/jsx-no-bind */
         ref: (ref) => {
           inputRef = ref;
-          DomNodeSubjectObserverFactory.addObserverToNode(ref, VegaBlur, handleChange);
+          DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaBlur, handleChange);
         } }))));
 };
 
@@ -76,7 +71,7 @@ const VegaPaginationPageSizeSelector = ({ pageSize, pageSizeSelectorOptions, onC
         })), value: pageSize.toString(), placeholder: "Page Size", vegaDropdownProps: { matchTargetWidth: false, searchable: false }, 
         /* eslint-disable-next-line react/jsx-no-bind */
         ref: (ref) => {
-          DomNodeSubjectObserverFactory.addObserverToNode(ref, VegaChange, handleChange);
+          DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaChange, handleChange);
         } }))));
 };
 
@@ -161,7 +156,7 @@ const VegaPaginationPageSelector = ({ total, current, onChange, pageCount, }) =>
       h("vega-button-circle", { variant: "icon-only", icon: icon, iconColor: "text-link", size: "small", disabled: isDisabled, 
         /* eslint-disable-next-line react/jsx-no-bind */
         ref: (ref) => {
-          DomNodeSubjectObserverFactory.addObserverToNode(ref, VegaClick, handleClick);
+          DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaClick, handleClick);
         } })));
   };
   const handlePrev = () => {

package/dist/esm/vega-pie-chart.entry.js

@@ -1,12 +1,11 @@
-import { r as registerInstance, h, g as getElement, H as Host } from './index-3e41c219.js';
-import { h as array, t as tau, j as constant, I as InteractingEntryGenerator, k as d3Select, B as BaseDrawer, a as BaseChart, L as LayoutInputProcessor, P as ProcessorChain, b as LegendInputProcessor, c as LegendDrawer } from './legendInputProcessor-c730fa05.js';
-import { s as sanitizeVegaComponent } from './component-ff56c5f5.js';
-import './global-slimmer-registry-f1dec4a2.js';
-import { I as InjectVegaGlobalSlimmer } from './inject-vega-global-slimmer-0e6dd982.js';
-import './array-195d7d64.js';
+import { r as registerInstance, h, g as getElement, H as Host } from './index-c3505689.js';
+import { h as array, t as tau, j as constant, I as InteractingEntryGenerator, k as d3Select, B as BaseDrawer, a as BaseChart, L as LayoutInputProcessor, P as ProcessorChain, b as LegendInputProcessor, c as LegendDrawer } from './legendInputProcessor-73659534.js';
+import { s as sanitizeVegaComponent } from './component-e4eb3f14.js';
+import './global-slimmer-registry-b91c742d.js';
+import { I as InjectVegaGlobalSlimmer } from './inject-vega-global-slimmer-c3f84156.js';
+import './array-e1522673.js';
 import './number-400b3bf2.js';
 import './typography-03d285b4.js';
-import './featureFlagController-5d7e64f1.js';
 import './log-a824be80.js';
 
 function descending(a, b) {