tsichart-core 1.0.0

package/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) Microsoft Corporation. All rights reserved.
+Copyright (c) 2024 Alexander Sysoiev
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE

package/README.MD

@@ -0,0 +1,189 @@
+# @tsichart/core - Time Series Interactive Charts
+
+A powerful, flexible JavaScript library for visualizing time series data with **interactive** charts. Built with TypeScript and D3.js, this library provides a rich set of chart components including line charts, bar charts, pie charts, heatmaps, scatter plots, and more.
+
+## Features
+
+✨ **Rich Component Library** - 20+ pre-built, customizable chart components  
+📊 **Interactive Visualizations** - Tooltips, zooming, panning, and dynamic data updates  
+🎨 **Themeable** - Built-in light and dark themes with customization options  
+📱 **Responsive** - Charts adapt to different screen sizes  
+🎯 **TypeScript Support** - Full type definitions included  
+🌳 **Tree-shakeable** - Import only the components you need  
+📦 **Zero Configuration** - Works out of the box with sensible defaults  
+
+**Note:** This library is a community-maintained fork of the original Microsoft Time Series Insights Client, rebranded as **Time Series Interactive Charts** and updated for generic time series visualization use cases.
+
+[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/%40tsichart%2Fcore.svg)](https://badge.fury.io/js/@tsichart/core) 
+
+## Installation
+
+### NPM
+
+```bash
+npm install @tsichart/core
+```
+
+### Yarn
+
+```bash
+yarn add @tsichart/core
+```
+
+### CDN
+
+You can also load directly from a CDN:
+
+```html
+<script src="https://unpkg.com/@tsichart/core@latest/tsiclient.js"></script>
+<link rel="stylesheet" type="text/css" href="https://unpkg.com/@tsichart/core@latest/tsiclient.css">
+```
+
+## Quick Start
+
+### Import All Components
+
+```js
+import TsiClient from "@tsichart/core";
+import "@tsichart/core/tsiclient.css";
+
+// Create a line chart
+let tsiClient = new TsiClient();
+let lineChart = new tsiClient.ux.LineChart(document.getElementById('chart'));
+
+// Prepare your data
+const data = [{
+  "Series1": {
+    "": {
+      "2023-01-01T00:00:00Z": { avg: 10 },
+      "2023-01-01T01:00:00Z": { avg: 15 },
+      "2023-01-01T02:00:00Z": { avg: 13 }
+    }
+  }
+}];
+
+// Render the chart
+lineChart.render(data, { theme: 'light', legend: 'compact' });
+```
+
+### Import Individual Components (Recommended for Tree-shaking)
+
+```js
+import LineChart from '@tsichart/core/LineChart';
+import '@tsichart/core/tsiclient.css';
+
+// Create and render chart
+let lineChart = new LineChart(document.getElementById('chart'));
+lineChart.render(data, { theme: 'light' });
+```
+
+## Available Components
+
+**tsiclient** provides the following visualization components:
+
+- **LineChart** - Render time series data as lines
+- **BarChart** - Display time series data as bars with timestamp slider
+- **PieChart** - Show time series data as pie charts with timestamp slider  
+- **Heatmap** - Visualize time series data as a heatmap
+- **ScatterPlot** - Plot time series data points as a scatter plot
+- **AvailabilityChart** - Display data availability over time
+- **Grid** - Render time series data in a tabular format
+- **Hierarchy** - Display hierarchical data structures
+- **EventsTable** - Show events in a table format
+- **DateTimePicker** - UI component for selecting date/time ranges
+- **TimezonePicker** - UI component for timezone selection
+- **Slider** - Time slider component
+- **ModelSearch** - Search component for time series models
+- **HierarchyNavigation** - Navigate hierarchical time series data
+- **ProcessGraphic** - Display process graphics with data overlays
+- **ColorPicker** - Color selection component
+- And more...
+
+For detailed usage examples and API documentation, see the [UX Components documentation](docs/UX.md).
+
+## Data Format
+
+All components work with a consistent JSON data structure. Here's the basic format:
+
+```js
+const data = [{
+  "SeriesName": {
+    "SplitByValue": {  // Use empty string "" if no split
+      "2023-01-01T00:00:00Z": {
+        avg: 10,    // Your metric values
+        min: 8,
+        max: 12
+      },
+      "2023-01-01T01:00:00Z": {
+        avg: 15,
+        min: 13,
+        max: 17
+      }
+    }
+  }
+}];
+```
+
+**You are responsible for:**
+- Fetching time series data from your data source (API, database, etc.)
+- Transforming your data into the expected format
+- Handling any authentication/authorization
+
+See the [UX Components documentation](docs/UX.md) for detailed format specifications for each chart type.
+
+## Resources
+
+* [Full API Documentation](docs/UX.md)
+* [Live Examples](pages/examples/) - Check the `pages/examples/` directory for working examples
+
+
+## Contributing
+
+Contributions are welcome! This is a community-maintained project. Please feel free to:
+
+- Report bugs and request features via [GitHub Issues](https://github.com/yourusername/tsichart-core/issues)
+- Submit pull requests
+- Improve documentation
+- Share examples of your usage
+
+## License
+
+MIT License - see [LICENSE](LICENSE) file for details.
+
+Original work Copyright (c) Microsoft Corporation  
+Modified work Copyright (c) 2024 [Your Name]
+
+## Acknowledgments
+
+This library is based on the original Microsoft Time Series Insights (TSI) JavaScript SDK, which has been deprecated. We've rebranded it as **Time Series Interactive Charts** and modernized it for generic time series visualization use cases.
+
+**TSI** now stands for **Time Series Interactive** - reflecting the library's focus on interactive data visualization rather than a specific cloud service.
+
+## Migration from Original TSIClient
+
+If you're migrating from the original Microsoft `tsiclient` package:
+
+1. **Package name change**: Update your imports from `tsiclient` to `@tsichart/core`
+2. **No breaking changes to component APIs**: The chart components work the same way
+3. **Remove server calls**: You'll need to handle data fetching yourself (Azure TSI service was retired)
+4. **Update documentation references**: Use the new documentation instead of Azure TSI docs
+- The `tsiClient.server` object and all related methods have been removed  
+- Focus is now exclusively on client-side visualization components
+
+**Version 1.3.0:**
+Starting with version 1.3.0, discrete events and state transitions will be represented just like numeric time series in the LineChart component. This may be a breaking change for users representing non-numeric series in the line chart using the "events" and "states" Chart Options. For usage instructions, consult [this example](https://tsiclientsample.azurewebsites.net/noauth/multipleseriestypes.html) and the associated [documentation](https://github.com/microsoft/tsiclient/blob/master/docs/UX.md#line-chart).
+
+
+## Contributing
+
+This project welcomes contributions and suggestions.  Most contributions require you to agree to a
+Contributor License Agreement (CLA) declaring that you have the right to, and actually do, grant us
+the rights to use your contribution. For details, visit https://cla.microsoft.com.
+
+When you submit a pull request, a CLA-bot will automatically determine whether you need to provide
+a CLA and decorate the PR appropriately (e.g., label, comment). Simply follow the instructions
+provided by the bot. You will only need to do this once across all repos using our CLA.
+
+This project has adopted the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/).
+For more information see the [Code of Conduct FAQ](https://opensource.microsoft.com/codeofconduct/faq/) or
+contact [opencode@microsoft.com](mailto:opencode@microsoft.com) with any additional questions or comments.

package/dist/AggregateExpression.d.ts

@@ -0,0 +1,13 @@
+import { C as ChartDataOptions } from './ChartDataOptions-DBS28b1-.js';
+import './Interfaces-BKRQ685G.js';
+
+declare class AggregateExpression extends ChartDataOptions {
+    measureObject: any;
+    splitByObject: any;
+    predicate: Object;
+    visibleSplitByCap: number;
+    constructor(predicateObject: any, measureObject: any, measureTypes: Array<string>, searchSpan: any, splitByObject: any, colorOrOptionsObject: any, alias?: string, contextMenu?: Array<any>);
+    toTsx(roundFromTo?: boolean): {};
+}
+
+export { AggregateExpression as default };

package/dist/AggregateExpression.js

@@ -0,0 +1,70 @@
+import { _ as __extends, a as __assign } from './_tslib-5_9pMg1F.js';
+import { U as Utils } from './Utils-C_j8IgZh.js';
+import { C as ChartDataOptions } from './ChartDataOptions-DRd8NHra.js';
+import 'd3';
+import 'moment-timezone';
+
+var MAXCARD = 150000;
+var AggregateExpression = /** @class */ (function (_super) {
+    __extends(AggregateExpression, _super);
+    function AggregateExpression(predicateObject, measureObject, measureTypes, searchSpan, splitByObject, colorOrOptionsObject, alias, contextMenu) {
+        if (splitByObject === void 0) { splitByObject = null; }
+        var _this = _super.call(this, (typeof (colorOrOptionsObject) === 'object' && !!colorOrOptionsObject) ? __assign(__assign({}, colorOrOptionsObject), { searchSpan: searchSpan, measureTypes: measureTypes }) : { color: colorOrOptionsObject, searchSpan: searchSpan, measureTypes: measureTypes, alias: alias, contextMenu: contextMenu }) || this;
+        _this.visibleSplitByCap = 10;
+        _this.predicate = predicateObject;
+        _this.splitByObject = splitByObject;
+        _this.measureObject = ((measureTypes.length == 1 && measureTypes[0] == 'count') || measureObject.property == 'Events Count') ? { count: {} } : { input: measureObject };
+        return _this;
+    }
+    AggregateExpression.prototype.toTsx = function (roundFromTo) {
+        var _this = this;
+        if (roundFromTo === void 0) { roundFromTo = false; }
+        var tsx = {};
+        var shiftMillis = Utils.parseShift(this.timeShift, this.startAt, this.searchSpan);
+        var fromMillis = this.searchSpan.from.valueOf() + shiftMillis;
+        var toMillis = this.searchSpan.to.valueOf() + shiftMillis;
+        var bucketSizeInMillis = Utils.parseTimeInput(this.searchSpan.bucketSize);
+        var roundedFromMillis = Math.floor((fromMillis + 62135596800000) / (bucketSizeInMillis)) * (bucketSizeInMillis) - 62135596800000;
+        var roundedToMillis = Math.ceil((toMillis + 62135596800000) / (bucketSizeInMillis)) * (bucketSizeInMillis) - 62135596800000;
+        if (roundFromTo) {
+            fromMillis = roundedFromMillis;
+            toMillis = roundedToMillis;
+        }
+        tsx['searchSpan'] = { from: (new Date(fromMillis)).toISOString(), to: (new Date(toMillis)).toISOString() };
+        // create aggregates
+        var measures = (this.measureObject.hasOwnProperty('count')) ? [{ count: {} }]
+            : this.measureTypes.reduce(function (p, c) {
+                var measureObject = {};
+                if (c == 'count')
+                    measureObject = { count: {} };
+                else
+                    measureObject[c] = _this['measureObject'];
+                p.push(measureObject);
+                return p;
+            }, []);
+        var aggregateObject = {};
+        var dimensionObject = { dateHistogram: { input: { builtInProperty: "$ts" }, breaks: { size: this.searchSpan.bucketSize } } };
+        if (this.splitByObject != null) {
+            var bucketsCeil = Math.ceil((roundedToMillis - roundedFromMillis) / bucketSizeInMillis);
+            aggregateObject['dimension'] = { uniqueValues: { input: this.splitByObject, take: Math.floor(MAXCARD / bucketsCeil) } };
+            aggregateObject['aggregate'] = { dimension: dimensionObject, measures: measures };
+        }
+        else {
+            aggregateObject['dimension'] = dimensionObject;
+            aggregateObject['measures'] = measures;
+        }
+        var aggregates = [aggregateObject];
+        tsx['aggregates'] = aggregates;
+        // create predicate
+        var predicate;
+        if (!this.measureObject.hasOwnProperty('count'))
+            predicate = { and: [this.predicate, { not: { eq: { left: this.measureObject.input, right: { 'double': null } } } }] };
+        else
+            predicate = this.predicate;
+        tsx['predicate'] = predicate;
+        return tsx;
+    };
+    return AggregateExpression;
+}(ChartDataOptions));
+
+export { AggregateExpression as default };