From c6195af3f7a2fe8fc433a434c0aaa402f269dc93 Mon Sep 17 00:00:00 2001 From: Luciana Corteggiano Date: Thu, 9 Mar 2023 15:01:55 -0700 Subject: [PATCH] feat: rename any sc- components to iot-app-kit-vis- --- design/base-chart.md | 2 +- packages/doc-site/docs/contributing.md | 2 +- packages/doc-site/docs/setup.md | 6 +- packages/doc-site/docs/webglContext.md | 26 +- packages/doc-site/styleguide.config.js | 2 +- .../cypress/integration/charts/alarms.spec.ts | 34 +- .../charts/annotation-rescaling.spec.ts | 2 +- .../charts/annotations-dragging.spec.ts | 4 +- .../bar-chart/draggable-annotations.spec.ts | 2 +- .../charts/bar-chart/empty-status.spec.ts | 2 +- .../charts/bar-chart/errors.spec.ts | 2 +- .../charts/bar-chart/gestures.spec.ts | 6 +- .../charts/bar-chart/loading.spec.ts | 2 +- .../bar-chart/sc-webgl-bar-chart.spec.ts | 4 +- .../bar-chart/threshold-coloration.spec.ts | 2 +- .../charts/bar-chart/tooltip.spec.ts | 8 +- .../charts/cross-resolution.spec.ts | 2 +- .../line-chart/draggable-annotations.spec.ts | 4 +- .../charts/line-chart/empty-status.spec.ts | 2 +- .../charts/line-chart/errors.spec.ts | 2 +- .../charts/line-chart/gestures.spec.ts | 8 +- .../charts/line-chart/loading.spec.ts | 2 +- .../charts/line-chart/sc-webgl-chart.spec.ts | 6 +- .../line-chart/threshold-coloration.spec.ts | 2 +- .../charts/line-chart/tooltip.spec.ts | 6 +- .../integration/charts/performance.spec.ts | 10 +- .../charts/rendering-meshes.spec.ts | 22 +- .../draggable-annotations.spec.ts | 2 +- .../charts/scatter-chart/empty-status.spec.ts | 2 +- .../charts/scatter-chart/errors.spec.ts | 2 +- .../charts/scatter-chart/gestures.spec.ts | 4 +- .../charts/scatter-chart/loading.spec.ts | 2 +- .../sc-webgl-scatter-chart.spec.ts | 2 +- .../threshold-coloration.spec.ts | 2 +- .../charts/scatter-chart/tooltip.spec.ts | 6 +- .../status-timeline/empty-status.spec.ts | 2 +- .../charts/status-timeline/errors.spec.ts | 4 +- .../charts/status-timeline/gestures.spec.ts | 4 +- .../charts/status-timeline/loading.spec.ts | 2 +- .../status-timeline/status-timeline.spec.ts | 16 +- .../status-timeline/threshold-legend.spec.ts | 18 +- .../charts/status-timeline/tooltip.spec.ts | 4 +- .../integration/expandable-input.spec.ts | 2 +- .../cypress/integration/size-provider.spec.ts | 34 +- .../cypress/integration/webglContext.spec.ts | 14 +- .../src/components.d.ts | 1650 ++++++++--------- .../charts/chart-icon/sc-chart-icon.spec.tsx | 8 +- .../charts/chart-icon/sc-chart-icon.tsx | 2 +- .../charts/sc-bar-chart/sc-bar-chart.spec.tsx | 4 +- .../charts/sc-bar-chart/sc-bar-chart.tsx | 13 +- .../sc-legend/sc-legend-row/sc-legend-row.css | 18 +- .../sc-legend-row/sc-legend-row.spec.tsx | 14 +- .../sc-legend/sc-legend-row/sc-legend-row.tsx | 8 +- .../components/charts/sc-legend/sc-legend.css | 4 +- .../charts/sc-legend/sc-legend.spec.tsx | 84 +- .../components/charts/sc-legend/sc-legend.tsx | 8 +- .../charts/sc-line-chart/lineMesh.ts | 2 +- .../sc-line-chart/sc-line-chart.spec.tsx | 4 +- .../charts/sc-line-chart/sc-line-chart.tsx | 13 +- .../sc-scatter-chart.spec.tsx | 4 +- .../sc-scatter-chart/sc-scatter-chart.tsx | 13 +- .../sc-status-timeline-overlay-row.css | 12 +- .../sc-status-timeline-overlay-row.spec.tsx | 8 +- .../sc-status-timeline-overlay-row.tsx | 6 +- .../sc-status-timeline-overlay.css | 4 +- .../sc-status-timeline-overlay.spec.tsx | 70 +- .../sc-status-timeline-overlay.tsx | 4 +- .../sc-status-timeline/sc-status-timeline.css | 6 +- .../sc-status-timeline.spec.tsx | 4 +- .../sc-status-timeline/sc-status-timeline.tsx | 12 +- .../sc-threshold-legend-row.tsx | 2 +- .../sc-threshold-legend.css | 6 +- .../sc-threshold-legend.spec.ts | 46 +- .../sc-threshold-legend.tsx | 4 +- .../charts/sc-tooltip/sc-tooltip-row.css | 12 +- .../charts/sc-tooltip/sc-tooltip-row.spec.tsx | 12 +- .../charts/sc-tooltip/sc-tooltip-row.tsx | 4 +- .../sc-tooltip/sc-tooltip-rows.spec.tsx | 76 +- .../charts/sc-tooltip/sc-tooltip-rows.tsx | 4 +- .../charts/sc-tooltip/sc-tooltip.css | 10 +- .../charts/sc-tooltip/sc-tooltip.tsx | 4 +- .../sc-webgl-base-chart/ErrorStatus.tsx | 2 +- .../sc-webgl-base-chart/LoadingStatus.tsx | 2 +- .../sc-gesture-handler.css | 8 +- .../sc-gesture-handler.tsx | 2 +- .../sc-webgl-base-chart/sc-webgl-axis.css | 16 +- .../sc-webgl-axis.spec.tsx | 8 +- .../sc-webgl-base-chart/sc-webgl-axis.tsx | 2 +- .../sc-webgl-base-chart.css | 18 +- .../sc-webgl-base-chart.spec.tsx | 31 +- .../sc-webgl-base-chart.tsx | 10 +- .../sc-data-stream-name.css | 4 +- .../sc-data-stream-name.spec.tsx | 8 +- .../sc-data-stream-name.tsx | 6 +- .../sc-error-badge/sc-error-badge.css | 4 +- .../sc-error-badge/sc-error-badge.tsx | 2 +- .../sc-expandable-input.css | 4 +- .../sc-expandable-input.spec.tsx | 6 +- .../sc-expandable-input.tsx | 2 +- .../sc-loading-spinner.spec.tsx | 6 +- .../sc-loading-spinner/sc-loading-spinner.tsx | 2 +- .../sc-size-provider/sc-size-provider.css | 2 +- .../sc-size-provider.spec.tsx | 13 +- .../sc-size-provider/sc-size-provider.tsx | 2 +- .../sc-webgl-context/sc-webgl-context.css | 2 +- .../sc-webgl-context/sc-webgl-context.tsx | 2 +- .../iot-app-kit-visualizations/src/index.html | 57 +- .../src/testing/app/app.tsx | 2 +- .../src/testing/app/routes.ts | 274 +-- .../chartDescriptions/describeErrorStatus.ts | 4 +- .../chartDescriptions/describeLegend.tsx | 8 +- .../describeLoadingStatus.ts | 6 +- .../describePassedInProps.tsx | 40 +- .../chartDescriptions/describeYRange.ts | 12 +- .../chartDescriptions/newChartSpecPage.ts | 2 +- .../dynamicWidgetUtils/testCaseParameters.ts | 2 +- .../src/testing/selectors.ts | 16 +- .../charts/line-chart-viewport-change.tsx | 4 +- .../performance/sc-line-chart-stream-data.tsx | 6 +- .../charts/sc-annotations-draggable-multi.tsx | 8 +- .../test-routes/charts/sc-chart-y-range.tsx | 6 +- .../sc-webgl-bar-chart-bar-margin.tsx | 6 +- .../sc-webgl-bar-chart-dynamic-buffer.tsx | 6 +- ...c-webgl-bar-chart-dynamic-data-streams.tsx | 6 +- .../sc-webgl-bar-chart-dynamic-data.tsx | 6 +- .../sc-webgl-bar-chart-fast-viewport.tsx | 6 +- .../sc-webgl-bar-chart-negative.tsx | 6 +- ...-bar-chart-positive-negative.component.tsx | 6 +- .../sc-webgl-bar-chart-standard.tsx | 6 +- .../sc-webgl-bar-chart-start-from-zero.tsx | 6 +- .../sc-webgl-bar-chart-threshold-band.tsx | 6 +- ...c-webgl-bar-chart-threshold-coloration.tsx | 6 +- ...-webgl-bar-chart-threshold-exact-point.tsx | 6 +- ...r-chart-threshold-multiple-data-stream.tsx | 6 +- ...ar-chart-threshold-multiple-thresholds.tsx | 6 +- ...ebgl-bar-chart-threshold-no-coloration.tsx | 6 +- ...webgl-bar-chart-unsupported-data-types.tsx | 6 +- .../sc-webgl-chart-annotation-editable.tsx | 6 +- ...l-chart-annotations-always-in-viewport.tsx | 6 +- .../charts/sc-webgl-chart-annotations.tsx | 6 +- .../charts/sc-webgl-chart-axis.tsx | 6 +- .../charts/sc-webgl-chart-dynamic-charts.tsx | 6 +- .../charts/sc-webgl-chart-large-viewport.tsx | 6 +- .../charts/sc-webgl-chart-multi.tsx | 8 +- .../charts/sc-webgl-chart-no-annotations.tsx | 6 +- ...gl-chart-standard-with-legend-on-right.tsx | 6 +- .../sc-webgl-chart-standard-with-legend.tsx | 6 +- .../charts/sc-webgl-chart-standard.tsx | 6 +- ...-webgl-chart-threshold-coloration-band.tsx | 6 +- ...chart-threshold-coloration-exact-point.tsx | 6 +- ...eshold-coloration-multiple-data-stream.tsx | 6 +- ...reshold-coloration-multiple-thresholds.tsx | 6 +- .../sc-webgl-chart-threshold-coloration.tsx | 6 +- ...art-tooltip-with-multiple-data-streams.tsx | 6 +- .../sc-webgl-line-chart-dynamic-buffer.tsx | 6 +- ...-webgl-line-chart-dynamic-data-streams.tsx | 6 +- .../sc-webgl-line-chart-dynamic-data.tsx | 6 +- ...ebgl-line-chart-unsupported-data-types.tsx | 4 +- .../sc-scatter-chart-dynamic-data.tsx | 6 +- ...catter-chart-threshold-coloration-band.tsx | 6 +- ...chart-threshold-coloration-exact-point.tsx | 6 +- ...eshold-coloration-multiple-data-stream.tsx | 6 +- ...reshold-coloration-multiple-thresholds.tsx | 6 +- .../sc-scatter-chart-threshold-coloration.tsx | 6 +- ...-scatter-chart-threshold-no-coloration.tsx | 6 +- ...-with-multiple-data-streams-and-trends.tsx | 6 +- ...r-chart-trend-line-color-configuration.tsx | 6 +- ...c-scatter-chart-trend-line-with-legend.tsx | 6 +- ...c-scatter-chart-unsupported-data-types.tsx | 6 +- .../charts/shaders/sc-angled-line-segment.tsx | 6 +- .../shaders/sc-bar-chart/sc-multiple-bars.tsx | 6 +- .../shaders/sc-bar-chart/sc-single-bar.tsx | 6 +- .../sc-bar-chart/sc-single-colored-bar.tsx | 6 +- .../shaders/sc-circle-point-shaders.tsx | 6 +- .../shaders/sc-line-chart-colored-point.tsx | 6 +- .../shaders/sc-multiple-lines-overlapping.tsx | 6 +- .../charts/shaders/sc-multiple-lines.tsx | 6 +- .../sc-straight-line-segment-colored.tsx | 6 +- .../shaders/sc-straight-line-segment.tsx | 6 +- .../status-timeline/multiple-statuses.tsx | 4 +- .../status-timeline/single-colored-status.tsx | 4 +- .../shaders/status-timeline/single-status.tsx | 4 +- .../status-timeline-dynamic-buffer.tsx | 4 +- .../status-timeline-dynamic-data-streams.tsx | 4 +- .../status-timeline-dynamic-data.tsx | 4 +- .../status-timeline-fast-viewport.tsx | 4 +- .../status-timeline-multiple-data-streams.tsx | 4 +- .../status-timeline-raw-data.tsx | 4 +- .../status-timeline-standard.tsx | 4 +- .../status-timeline-status-margin.tsx | 4 +- .../status-timeline-threshold-band.tsx | 4 +- .../status-timeline-threshold-coloration.tsx | 4 +- .../status-timeline-threshold-exact-point.tsx | 4 +- ...imeline-threshold-multiple-data-stream.tsx | 4 +- ...timeline-threshold-multiple-thresholds.tsx | 4 +- ...tatus-timeline-threshold-no-coloration.tsx | 4 +- .../sc-expandable-input-standard.tsx | 4 +- .../sc-size-provider-standard.tsx | 4 +- .../sc-webgl-context-nested.tsx | 8 +- .../sc-webgl-context-root.tsx | 10 +- .../testing/test-routes/widget-test-route.tsx | 2 +- .../testing/testing-ground/sc-box/sc-box.tsx | 2 +- 202 files changed, 1801 insertions(+), 1705 deletions(-) diff --git a/design/base-chart.md b/design/base-chart.md index d6f4a7a9c..0974cf2c6 100644 --- a/design/base-chart.md +++ b/design/base-chart.md @@ -1,6 +1,6 @@ # Base chart -Base chart (which is exposed as the Web component ``) is a shared component used across the following components: +Base chart (which is exposed as the Web component ``) is a shared component used across the following components: - line chart - scatter chart diff --git a/packages/doc-site/docs/contributing.md b/packages/doc-site/docs/contributing.md index 663b0be88..7369b25a4 100644 --- a/packages/doc-site/docs/contributing.md +++ b/packages/doc-site/docs/contributing.md @@ -1,6 +1,6 @@ Important things to know when building a new component: 1. Use `viewportHandler` to sync up with all the other component in order to provide the synchronization feature. - - A good example to follow is the `sc-table` component. + - A good example to follow is the `iot-app-kit-vis-table` component. ```js static componentDidLoad() { this.viewportGroups.add({ viewportGroup: 'The name of the viewport group' }) diff --git a/packages/doc-site/docs/setup.md b/packages/doc-site/docs/setup.md index c9278e755..b170a111b 100644 --- a/packages/doc-site/docs/setup.md +++ b/packages/doc-site/docs/setup.md @@ -21,19 +21,19 @@ 2. Initialize components if you are not using the react wrapper ```js static - import { defineComponents, applyPolyfill } from '@synchro-charts/core/dist/loader'; + import { defineComponents, applyPolyfill } from '@iot-app-kit-visualizations/core/dist/loader'; applyPolyfill().then(() => defineComponents()); ``` If you are using the react wrapper, this step is not necessary. -3. Include a `` +3. Include a `` Include the webgl context such that it's present where ever you utilize webgl based components (not required for all components) ```jsx static ... - + ... ``` diff --git a/packages/doc-site/docs/webglContext.md b/packages/doc-site/docs/webglContext.md index 5bdece8b9..3c2ddc236 100644 --- a/packages/doc-site/docs/webglContext.md +++ b/packages/doc-site/docs/webglContext.md @@ -16,7 +16,7 @@ WebGL context must be large enough to contain all the visualizations. To set up the WebGL context, you will create a single instance of the following web component: ```jsx static - + ``` This component will create a single canvas element, and create an associated WebGL context to this canvas. Additionally, this component @@ -27,11 +27,11 @@ If you want the viewport to be the viewing frame, place the context component in ```jsx static - + or - + ``` Additionally you can pick an HTML Element as the viewing frame. This element should operate similar to the viewport in that it can scroll child contents that overflow @@ -40,26 +40,26 @@ and will respond to resizing events. *Note: The viewing frame can't be larger than the viewport size. The canvas will start clipping anything past that bound.* ```jsx static - + ``` #### Correct place of initialization -Ensure that the position of the `` is correct - Since this component constructs the canvas which the visualizations are painted on, it's important that the `` is rendered on top of respective components. +Ensure that the position of the `` is correct + Since this component constructs the canvas which the visualizations are painted on, it's important that the `` is rendered on top of respective components. Here's an example of a correct utilization of the component: ```jsx static
- - + + ... - +
``` - Notice that the `` is initialized after the other visualizations - this ensures that the axis lines are rendered underneath the visualized data. + Notice that the `` is initialized after the other visualizations - this ensures that the axis lines are rendered underneath the visualized data. More information about rendering HTML elements in the correct order within [Mozilla's documentation on stacking context](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context) @@ -67,10 +67,10 @@ Ensure that the position of the `` is correct It can be useful to have direct access to the underlying WebGL context for purposes such as debugging. -The `` web component has a functional prop `onContextInitialization` that is called with a `WebGLRenderingContext` after initialization. +The `` web component has a functional prop `onContextInitialization` that is called with a `WebGLRenderingContext` after initialization. ```jsx static - { + { // your code }} /> ``` @@ -81,7 +81,7 @@ This callback can be used to, for example, instrument your development environme 1. Visualization clips on bottom 16px of screen - This [issue](https://github.com/awslabs/synchro-charts/issues/30) is caused due to the canvas constructed by the `` not covering the last `16px` of the screen. This issue + This [issue](https://github.com/awslabs/synchro-charts/issues/30) is caused due to the canvas constructed by the `` not covering the last `16px` of the screen. This issue will only be visible if you have no horizontal scroll bar on the bottom of the browser. 2. Visualized data briefly lag behind the associated component on browser resize diff --git a/packages/doc-site/styleguide.config.js b/packages/doc-site/styleguide.config.js index 34507f364..2679f5fa3 100644 --- a/packages/doc-site/styleguide.config.js +++ b/packages/doc-site/styleguide.config.js @@ -121,7 +121,7 @@ module.exports = { ], getComponentPathLine(componentPath) { const name = path.basename(componentPath, '.js'); - return `import { ${name} } from '@synchro-charts/react'; // `; + return `import { ${name} } from '@iot-app-kit-visualizations/react'; // `; }, styleguideComponents: { SectionsRenderer: path.join(__dirname, 'src/styleguide/Sections'), diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/alarms.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/alarms.spec.ts index 3f4371d3f..8764413e2 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/alarms.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/alarms.spec.ts @@ -16,7 +16,7 @@ import { COMPARISON_OPERATOR, StatusIcon } from '../../../src/components/charts/ const SMALL_WAIT = 0.05 * SECOND_IN_MS; const LEGEND_VALUE_SELECTOR = '[data-testid=current-value]'; -const STATUS_ICON_SELECTOR = 'sc-chart-icon'; +const STATUS_ICON_SELECTOR = 'iot-app-kit-vis-chart-icon'; const ALARM_COLOR = 'rgb(255, 0, 0)'; // also known as 'red' const LATEST_VALUE = 120; @@ -82,7 +82,7 @@ describe('when provided alarm data through a `dynamic-widget`', () => { describe('line-chart', () => { it('does not visualize numerical alarm data', () => { visitDynamicWidget(cy, { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', dataStreams: [NUMERICAL_ALARM_STREAM], viewportStart, viewportEnd, @@ -96,7 +96,7 @@ describe('when provided alarm data through a `dynamic-widget`', () => { it('does not render alarms on tooltip', () => { visitDynamicWidget(cy, { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', dataStreams: [NUMERICAL_ALARM_STREAM], viewportStart, viewportEnd, @@ -118,7 +118,7 @@ describe('when provided alarm data through a `dynamic-widget`', () => { describe('scatter-chart', () => { it('does not visualize numerical alarm data', () => { visitDynamicWidget(cy, { - componentTag: 'sc-scatter-chart', + componentTag: 'iot-app-kit-vis-scatter-chart', dataStreams: [NUMERICAL_ALARM_STREAM], viewportStart, viewportEnd, @@ -132,7 +132,7 @@ describe('when provided alarm data through a `dynamic-widget`', () => { it('does not render alarms on tooltip', () => { visitDynamicWidget(cy, { - componentTag: 'sc-scatter-chart', + componentTag: 'iot-app-kit-vis-scatter-chart', dataStreams: [NUMERICAL_ALARM_STREAM], viewportStart, viewportEnd, @@ -154,7 +154,7 @@ describe('when provided alarm data through a `dynamic-widget`', () => { describe('bar-chart', () => { it('does not visualize numerical alarm data', () => { visitDynamicWidget(cy, { - componentTag: 'sc-bar-chart', + componentTag: 'iot-app-kit-vis-bar-chart', dataStreams: [NUMERICAL_ALARM_STREAM], viewportStart, viewportEnd, @@ -168,7 +168,7 @@ describe('when provided alarm data through a `dynamic-widget`', () => { it('does not render alarms on tooltip', () => { visitDynamicWidget(cy, { - componentTag: 'sc-bar-chart', + componentTag: 'iot-app-kit-vis-bar-chart', dataStreams: [NUMERICAL_ALARM_STREAM], viewportStart, viewportEnd, @@ -190,7 +190,7 @@ describe('when provided alarm data through a `dynamic-widget`', () => { describe('status-timeline', () => { it('does visualize numerical alarm data', () => { visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', alarms: { expires: MINUTE_IN_MS }, dataStreams: [NUMERICAL_ALARM_STREAM], viewportStart, @@ -205,7 +205,7 @@ describe('when provided alarm data through a `dynamic-widget`', () => { it('does render alarms on tooltip', () => { visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', dataStreams: [NUMERICAL_ALARM_STREAM], annotations: { y: [ALARM_THRESHOLD] }, viewportStart, @@ -231,7 +231,7 @@ describe('when provided alarm data through a `dynamic-widget`', () => { describe('widgets determine whether to display alarms within the legend or not', () => { it('does not display a legend entry for numerical alarm data when rendering a line-chart', () => { visitDynamicWidget(cy, { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', dataStreams: [NUMERICAL_ALARM_STREAM, PROPERTY_STREAM], annotations: { y: [ALARM_THRESHOLD] }, }); @@ -244,7 +244,7 @@ describe('when provided alarm data through a `dynamic-widget`', () => { it('does not display a legend entry for numerical alarm data when rendering a scatter-chart', () => { visitDynamicWidget(cy, { - componentTag: 'sc-scatter-chart', + componentTag: 'iot-app-kit-vis-scatter-chart', dataStreams: [NUMERICAL_ALARM_STREAM, PROPERTY_STREAM], annotations: { y: [ALARM_THRESHOLD] }, }); @@ -257,7 +257,7 @@ describe('when provided alarm data through a `dynamic-widget`', () => { it('does not display a legend entry for numerical alarm data when rendering a bar-chart', () => { visitDynamicWidget(cy, { - componentTag: 'sc-bar-chart', + componentTag: 'iot-app-kit-vis-bar-chart', dataStreams: [NUMERICAL_ALARM_STREAM, PROPERTY_STREAM], annotations: { y: [ALARM_THRESHOLD] }, }); @@ -270,7 +270,7 @@ describe('when provided alarm data through a `dynamic-widget`', () => { it('does display a legend entry for numerical alarm data when rendering a status-timeline', () => { visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', dataStreams: [NUMERICAL_ALARM_STREAM, PROPERTY_STREAM], annotations: { y: [ALARM_THRESHOLD] }, }); @@ -290,7 +290,7 @@ describe('when provided alarm data through a `dynamic-widget`', () => { it('shows the data property on the legend as in alarm, from the associated alarm data which is being breached', () => { visitDynamicWidget(cy, { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', dataStreams: DATA, annotations: ANNOTATIONS, }); @@ -308,7 +308,7 @@ describe('when provided alarm data through a `dynamic-widget`', () => { it('shows the data property on the legend in alarm, when the most recent point is breaching a threshold', () => { // This viewport is offset such that a new data becomes the latest. visitDynamicWidget(cy, { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', dataStreams: DATA, annotations: ANNOTATIONS, viewportStart: new Date(2000, 0, 0, 6), @@ -328,7 +328,7 @@ describe('when provided alarm data through a `dynamic-widget`', () => { it('shows the data property on the legend in alarm, when the most recent point is breaching a threshold, but is before the viewport', () => { // This viewport is offset such that none of the data presented is in view. visitDynamicWidget(cy, { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', dataStreams: DATA, annotations: ANNOTATIONS, viewportStart: new Date(2000, 0, 3), @@ -348,7 +348,7 @@ describe('when provided alarm data through a `dynamic-widget`', () => { it('does not show any value or alarmed status when there is no values before the viewport', () => { // This viewport is offset such that all of the data is after the viewport visitDynamicWidget(cy, { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', annotations: ANNOTATIONS, dataStreams: DATA, viewportStart: new Date(1990, 0, 0), diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/annotation-rescaling.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/annotation-rescaling.spec.ts index 628451983..e3a0008e6 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/annotation-rescaling.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/annotation-rescaling.spec.ts @@ -55,7 +55,7 @@ const yAnnotation: YAnnotation = { }; const query: Partial = { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', viewportStart: X_MIN, viewportEnd: X_MAX, dataStreams: [ diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/annotations-dragging.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/annotations-dragging.spec.ts index a77d83f75..e7ac9a278 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/annotations-dragging.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/annotations-dragging.spec.ts @@ -1,7 +1,7 @@ import { DRAGGABLE_HANDLE_SELECTOR } from '../../../src/components/charts/common/annotations/YAnnotations/YAnnotations'; it('correctly handles dragging annotations when multiple charts share a reference to the same annotation', () => { - cy.visit('http://localhost:3333/tests/sc-webgl-chart/annotations/draggable-multi'); + cy.visit('http://localhost:3333/tests/webgl-chart/annotations/draggable-multi'); cy.viewport(1000, 1000); cy.waitForChart(); @@ -27,7 +27,7 @@ it('correctly handles dragging annotations when multiple charts share a referenc .parent() .find('.y-value-text') .get(0).textContent as string; - cy.get('sc-line-chart') + cy.get('iot-app-kit-vis-line-chart') .last() .contains(firstAnnotationsValue) .should('not.exist'); diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/draggable-annotations.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/draggable-annotations.spec.ts index e88a7f531..1b29a437d 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/draggable-annotations.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/draggable-annotations.spec.ts @@ -18,7 +18,7 @@ import { moveHandle, moveHandleFilter, moveHandleWithPause, parseTransformYValue import { AggregateType } from '../../../../src/utils/dataTypes'; const timelineParams: Partial = { - componentTag: 'sc-bar-chart', + componentTag: 'iot-app-kit-vis-bar-chart', viewportStart: X_MIN, viewportEnd: X_MAX, dataStreams: [ diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/empty-status.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/empty-status.spec.ts index 416a86615..10da7653e 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/empty-status.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/empty-status.spec.ts @@ -2,7 +2,7 @@ import { CHART_VIZ_CONTAINER_SELECTOR, visitDynamicWidget } from '../../../../sr import { DATA_STREAM } from '../../../../src/testing/__mocks__/mockWidgetProperties'; import { messageOverrides } from '../../../../src/testing/__mocks__/mockMessgeOverrides'; -const componentTag = 'sc-bar-chart'; +const componentTag = 'iot-app-kit-vis-bar-chart'; it('renders the "no streams present" messaging when no streams preset', () => { visitDynamicWidget(cy, { diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/errors.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/errors.spec.ts index cf2fde101..9bde11285 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/errors.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/errors.spec.ts @@ -7,7 +7,7 @@ import { DATA_STREAM } from '../../../../src/testing/__mocks__/mockWidgetPropert it('displays error when there is an error', () => { visitDynamicWidget(cy, { - componentTag: 'sc-bar-chart', + componentTag: 'iot-app-kit-vis-bar-chart', dataStreams: [{ ...DATA_STREAM, error: 'beep beep SEV-2' }], }); diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/gestures.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/gestures.spec.ts index 28254618e..7fe33a4b5 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/gestures.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/gestures.spec.ts @@ -15,7 +15,7 @@ it('moves viewport when gestures are applied', () => { const OLD_X_AXIS_TICK = 'Fri 31'; visitDynamicWidget(cy, { - componentTag: 'sc-bar-chart', + componentTag: 'iot-app-kit-vis-bar-chart', viewportStart: START, viewportEnd: END, gestures: true, @@ -40,7 +40,7 @@ it('does not move viewport when gestures are not applied', () => { const OLD_X_AXIS_TICK = 'Fri 31'; visitDynamicWidget(cy, { - componentTag: 'sc-bar-chart', + componentTag: 'iot-app-kit-vis-bar-chart', viewportStart: START, viewportEnd: END, gestures: false, @@ -59,7 +59,7 @@ it('does not move viewport when gestures are not applied', () => { it('adjusts y range as data in the view changes', () => { cy.viewport(VIEWPORT_WIDTH, VIEWPORT_HEIGHT); - cy.visit(`${root}/chart/y-range?componentTag=sc-bar-chart`); + cy.visit(`${root}/chart/y-range?componentTag=iot-app-kit-vis-bar-chart`); const EXISTING_Y_VALUE = '18k'; diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/loading.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/loading.spec.ts index 36e4219f8..5002ac8fa 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/loading.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/loading.spec.ts @@ -3,7 +3,7 @@ import { DATA_STREAM } from '../../../../src/testing/__mocks__/mockWidgetPropert it('renders spinner', () => { visitDynamicWidget(cy, { - componentTag: 'sc-bar-chart', + componentTag: 'iot-app-kit-vis-bar-chart', dataStreams: [{ ...DATA_STREAM, isLoading: true }], }); diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/sc-webgl-bar-chart.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/sc-webgl-bar-chart.spec.ts index 85b4230eb..b70291adf 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/sc-webgl-bar-chart.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/sc-webgl-bar-chart.spec.ts @@ -5,7 +5,7 @@ import { Y_VALUE } from '../../../../src/testing/test-routes/charts/constants'; const SMALL_WAIT = 0.1 * SECOND_IN_MS; describe('bar chart', () => { - const root = '/tests/sc-webgl-bar-chart'; + const root = '/tests/webgl-bar-chart'; const VIEWPORT_HEIGHT = 600; const VIEWPORT_WIDTH = 500; @@ -165,7 +165,7 @@ describe('bar chart', () => { }); describe('handles buffer increasing in size after initialization', () => { - const root = '/tests/sc-webgl-bar-chart'; + const root = '/tests/webgl-bar-chart'; const VIEWPORT_HEIGHT = 600; const VIEWPORT_WIDTH = 500; diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/threshold-coloration.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/threshold-coloration.spec.ts index b54cc0853..b37021c5e 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/threshold-coloration.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/threshold-coloration.spec.ts @@ -1,4 +1,4 @@ -const bcRoot = '/tests/sc-webgl-bar-chart'; +const bcRoot = '/tests/webgl-bar-chart'; // @ts-ignore const VIEWPORT_HEIGHT = 600; diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/tooltip.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/tooltip.spec.ts index ced3c523d..40cdcb4c7 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/tooltip.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/bar-chart/tooltip.spec.ts @@ -17,7 +17,7 @@ import { it('renders no tooltip when only info is empty', () => { visitDynamicWidget(cy, { - componentTag: 'sc-bar-chart', + componentTag: 'iot-app-kit-vis-bar-chart', viewportStart: new Date(START_DATE.getTime() - MINUTE_IN_MS), viewportEnd: new Date(START_DATE.getTime() + 10 * MINUTE_IN_MS), dataStreams: [{ ...NUMBER_EMPTY_STREAM, resolution: SECOND_IN_MS }], @@ -37,7 +37,7 @@ it('renders no tooltip when only info is empty', () => { it('renders no tooltip when there is no data for the requested resolution', () => { visitDynamicWidget(cy, { - componentTag: 'sc-bar-chart', + componentTag: 'iot-app-kit-vis-bar-chart', viewportStart: new Date(START_DATE.getTime() - MINUTE_IN_MS), viewportEnd: new Date(START_DATE.getTime() + 10 * MINUTE_IN_MS), dataStreams: [{ ...NUMBER_STREAM_1, resolution: SECOND_IN_MS }], @@ -58,7 +58,7 @@ it('renders no tooltip when there is no data for the requested resolution', () = it('renders tooltip rows in order of values magnitude', () => { const resolution = MINUTE_IN_MS; visitDynamicWidget(cy, { - componentTag: 'sc-bar-chart', + componentTag: 'iot-app-kit-vis-bar-chart', viewportStart: new Date(START_DATE.getTime() - MINUTE_IN_MS), viewportEnd: new Date(START_DATE.getTime() + 10 * MINUTE_IN_MS), dataStreams: [ @@ -102,7 +102,7 @@ it('renders tooltip rows in order of values magnitude', () => { it('renders tooltip to the left of the mouse when the mouse is on the right side', () => { visitDynamicWidget(cy, { - componentTag: 'sc-bar-chart', + componentTag: 'iot-app-kit-vis-bar-chart', viewportStart: new Date(new Date(2000, 0, 0).getTime() - MINUTE_IN_MS), viewportEnd: new Date(2000, 0, 0, 0, 5), dataStreams: [NUMBER_STREAM_1], diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/cross-resolution.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/cross-resolution.spec.ts index 0224adae8..dcbab331a 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/cross-resolution.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/cross-resolution.spec.ts @@ -43,7 +43,7 @@ const AGGREGATED_DATA_STREAM = { it('displays each aggregation description within tooltip', () => { visitDynamicWidget(cy, { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', viewportStart: START, viewportEnd: END, dataStreams: [RAW_DATA_STREAM, AGGREGATED_DATA_STREAM], diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/draggable-annotations.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/draggable-annotations.spec.ts index 70ef610b5..9b8bf7151 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/draggable-annotations.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/draggable-annotations.spec.ts @@ -46,7 +46,7 @@ const xAnnotation: XAnnotation = { }; const timelineParams: Partial = { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', viewportStart: X_MIN, viewportEnd: X_MAX, dataStreams: [ @@ -71,7 +71,7 @@ const timelineParams: Partial = { height: '95%', }; -const root = '/tests/sc-webgl-chart/annotations/annotation-editable'; +const root = '/tests/webgl-chart/annotations/annotation-editable'; it('changing isEditable updates draggable annotations', () => { cy.visit(root); diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/empty-status.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/empty-status.spec.ts index 63aec5174..41f553a22 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/empty-status.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/empty-status.spec.ts @@ -2,7 +2,7 @@ import { CHART_VIZ_CONTAINER_SELECTOR, visitDynamicWidget } from '../../../../sr import { DATA_STREAM } from '../../../../src/testing/__mocks__/mockWidgetProperties'; import { messageOverrides } from '../../../../src/testing/__mocks__/mockMessgeOverrides'; -const componentTag = 'sc-line-chart'; +const componentTag = 'iot-app-kit-vis-line-chart'; it('renders the "no streams present" messaging when no streams preset', () => { visitDynamicWidget(cy, { diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/errors.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/errors.spec.ts index a7bbc4906..524e273ed 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/errors.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/errors.spec.ts @@ -7,7 +7,7 @@ import { DATA_STREAM } from '../../../../src/testing/__mocks__/mockWidgetPropert it('displays error when there is an error', () => { visitDynamicWidget(cy, { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', dataStreams: [{ ...DATA_STREAM, error: 'beep beep SEV-2' }], }); diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/gestures.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/gestures.spec.ts index eee41b540..93a4381ce 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/gestures.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/gestures.spec.ts @@ -15,7 +15,7 @@ it('moves viewport when gestures are applied', () => { const OLD_Y_TICK_LABEL = 'Fri 31'; visitDynamicWidget(cy, { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', viewportStart: START, viewportEnd: END, gestures: true, @@ -38,7 +38,7 @@ it('does not move viewport when gestures are not applied', () => { const OLD_Y_TICK_LABEL = 'Fri 31'; visitDynamicWidget(cy, { - componentTag: 'sc-scatter-chart', + componentTag: 'iot-app-kit-vis-scatter-chart', viewportStart: START, viewportEnd: END, gestures: false, @@ -57,7 +57,7 @@ it('does not move viewport when gestures are not applied', () => { it('adjusts y range as data in the view changes', () => { cy.viewport(VIEWPORT_WIDTH, VIEWPORT_HEIGHT); - cy.visit(`${root}/chart/y-range?componentTag=sc-line-chart`); + cy.visit(`${root}/chart/y-range?componentTag=iot-app-kit-vis-line-chart`); cy.waitForChart(); @@ -78,7 +78,7 @@ it('adjusts y range as data in the view changes', () => { describe('gestures while charts are synchronized', () => { it('zooms into both charts', () => { - cy.visit(`${root}/sc-webgl-chart/multi`); + cy.visit(`${root}/webgl-chart/multi`); cy.viewport(VIEWPORT_WIDTH, VIEWPORT_HEIGHT); cy.waitForChart(); diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/loading.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/loading.spec.ts index 498cc18f2..9a6e00688 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/loading.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/loading.spec.ts @@ -3,7 +3,7 @@ import { DATA_STREAM } from '../../../../src/testing/__mocks__/mockWidgetPropert it('renders spinner', () => { visitDynamicWidget(cy, { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', dataStreams: [{ ...DATA_STREAM, isLoading: true }], }); diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/sc-webgl-chart.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/sc-webgl-chart.spec.ts index fd91e3c89..77d4ce3e0 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/sc-webgl-chart.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/sc-webgl-chart.spec.ts @@ -16,7 +16,7 @@ import { import { clickAndDrag } from '../../../utils'; import { CHART_VIZ_CONTAINER_SELECTOR, visitDynamicWidget } from '../../../../src/testing/selectors'; -const root = '/tests/sc-webgl-chart'; +const root = '/tests/webgl-chart'; const VIEWPORT_HEIGHT = 500; const VIEWPORT_WIDTH = 500; @@ -40,7 +40,7 @@ describe('line chart', () => { }); it('renders chart with a large viewport', () => { - cy.visit(`${root}/sc-webgl-chart-large-viewport`); + cy.visit(`${root}/webgl-chart-large-viewport`); cy.waitForChart(); @@ -220,7 +220,7 @@ describe('line chart', () => { it('renders the y-axis label if passed in', () => { visitDynamicWidget(cy, { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', axis: { labels: { yAxis: { diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/threshold-coloration.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/threshold-coloration.spec.ts index 7a0256269..c5b58a991 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/threshold-coloration.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/threshold-coloration.spec.ts @@ -1,4 +1,4 @@ -const webglRoot = '/tests/sc-webgl-chart'; +const webglRoot = '/tests/webgl-chart'; // @ts-ignore const VIEWPORT_HEIGHT = 500; diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/tooltip.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/tooltip.spec.ts index f082a5f91..1cc118e38 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/tooltip.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/line-chart/tooltip.spec.ts @@ -16,7 +16,7 @@ import { it('renders no tooltip when only info is empty', () => { visitDynamicWidget(cy, { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', viewportStart: new Date(2000, 0, 0), viewportEnd: new Date(2000, 0, 0, 0, 5), dataStreams: [NUMBER_EMPTY_STREAM], @@ -36,7 +36,7 @@ it('renders no tooltip when only info is empty', () => { it('renders tooltip rows in order of values magnitude', () => { visitDynamicWidget(cy, { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', viewportStart: new Date(new Date(2000, 0, 0).getTime() - MINUTE_IN_MS), viewportEnd: new Date(2000, 0, 0, 0, 5), dataStreams: [NUMBER_STREAM_1, NUMBER_STREAM_2], @@ -77,7 +77,7 @@ it('renders tooltip rows in order of values magnitude', () => { it('renders tooltip to the left of the mouse when the mouse is on the right side', () => { visitDynamicWidget(cy, { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', viewportStart: new Date(new Date(2000, 0, 0).getTime() - MINUTE_IN_MS), viewportEnd: new Date(2000, 0, 0, 0, 5), dataStreams: [NUMBER_STREAM_1], diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/performance.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/performance.spec.ts index c44c875d7..5c5e4e348 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/performance.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/performance.spec.ts @@ -3,7 +3,7 @@ import { initFPSMetering } from '../../../src/utils/fps'; import { DAY_IN_MS, SECOND_IN_MS } from '../../../src/utils/time'; import { avg, standardDeviation } from '../../utils'; -const root = '/tests/sc-webgl-chart/performance'; +const root = '/tests/webgl-chart/performance'; type PerfTestCase = { // The minimum frames per second which will be considered a passing test @@ -91,9 +91,9 @@ describe.skip('line chart', () => { new Array(RUN_EACH_TEST_NUM_TIMES).fill(0).forEach((_, runNum) => { it(`RUN ${runNum + 1}: ${testName}`, () => { cy.visit( - `${root}/sc-line-chart-stream-data?viewportSpeed=${viewportSpeed || 0}&roundFrequency=${roundFrequency}&dataPerRound=${dataPerRound}` + `${root}/line-chart-stream-data?viewportSpeed=${viewportSpeed || 0}&roundFrequency=${roundFrequency}&dataPerRound=${dataPerRound}` ); - cy.get('sc-line-chart').should('exist'); + cy.get('iot-app-kit-vis-line-chart').should('exist'); const { fps, stop } = initFPSMetering(); @@ -118,10 +118,10 @@ describe.skip('line chart', () => { average: Math.floor(avg(testResults.average)), median: Math.floor(avg(testResults.median)), stdDevMedian: Math.floor(standardDeviation(testResults.median)), - stdDevAverage: Math.floor( standardDeviation(testResults.average) ), + stdDevAverage: Math.floor(standardDeviation(testResults.average)), } }); - cy.writeFile(`performance_reports/perf.sc-chart-perf-${new Date().toISOString()}.json`, translatedResults); + cy.writeFile(`performance_reports/perf.chart-perf-${new Date().toISOString()}.json`, translatedResults); }); }) diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/rendering-meshes.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/rendering-meshes.spec.ts index 2495a1868..12832af98 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/rendering-meshes.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/rendering-meshes.spec.ts @@ -11,7 +11,7 @@ it('renders data to a millisecond level of granularity', () => { const end = new Date(start.getTime() + 5); visitDynamicWidget(cy, { - componentTag: 'sc-line-chart', + componentTag: 'iot-app-kit-vis-line-chart', dataStreams: [ { id: 'some-data-stream', @@ -54,21 +54,21 @@ it('renders data to a millisecond level of granularity', () => { describe('bar chart', () => { it('renders a single bar', () => { - cy.visit('/tests/sc-webgl-chart/single-bar'); + cy.visit('/tests/webgl-chart/single-bar'); cy.viewport(CHART_SIZE.width, CHART_SIZE.height); cy.wait(WAIT_MS); cy.get('#test-container').matchImageSnapshotOnCI(); }); it('renders a colored bar as red', () => { - cy.visit('/tests/sc-webgl-chart/single-colored-bar'); + cy.visit('/tests/webgl-chart/single-colored-bar'); cy.viewport(CHART_SIZE.width, CHART_SIZE.height); cy.wait(WAIT_MS); cy.get('#test-container').matchImageSnapshotOnCI(); }); it('renders multiple data streams as two bars', () => { - cy.visit('/tests/sc-webgl-chart/multiple-bars'); + cy.visit('/tests/webgl-chart/multiple-bars'); cy.viewport(200, 200); cy.wait(WAIT_MS); cy.get('#test-container').matchImageSnapshotOnCI(); @@ -77,35 +77,35 @@ describe('bar chart', () => { describe('line chart', () => { it('renders colored point as red', () => { - cy.visit('/tests/sc-webgl-chart/colored-point'); + cy.visit('/tests/webgl-chart/colored-point'); cy.viewport(CHART_SIZE.width, CHART_SIZE.height); cy.wait(WAIT_MS); cy.get('#test-container').matchImageSnapshotOnCI(); }); it('renders circle correctly with anti-aliasing', () => { - cy.visit('/tests/sc-webgl-chart/circle-point-shaders'); + cy.visit('/tests/webgl-chart/circle-point-shaders'); cy.viewport(CHART_SIZE.width, CHART_SIZE.height); cy.wait(WAIT_MS); cy.get('#test-container').matchImageSnapshotOnCI(); }); it('renders straight line segment between two dots', () => { - cy.visit('/tests/sc-webgl-chart/straight-line-segment'); + cy.visit('/tests/webgl-chart/straight-line-segment'); cy.viewport(CHART_SIZE.width, CHART_SIZE.height); cy.wait(WAIT_MS); cy.get('#test-container').matchImageSnapshotOnCI(); }); it('renders straight line segment between two dots as the color purple', () => { - cy.visit('/tests/sc-webgl-chart/straight-line-segment-colored'); + cy.visit('/tests/webgl-chart/straight-line-segment-colored'); cy.viewport(CHART_SIZE.width, CHART_SIZE.height); cy.wait(WAIT_MS); cy.get('#test-container').matchImageSnapshotOnCI(); }); it('renders angled line segment between two dots with anti-aliasing', () => { - cy.visit('/tests/sc-webgl-chart/angled-line-segment'); + cy.visit('/tests/webgl-chart/angled-line-segment'); cy.viewport(CHART_SIZE.width, CHART_SIZE.height); cy.wait(WAIT_MS); cy.get('#test-container').matchImageSnapshotOnCI(); @@ -113,7 +113,7 @@ describe('line chart', () => { it('renders multiple data streams as disconnected lines', () => { // NOTE: There should be two parallel lines connecting two pairs of dots - cy.visit('/tests/sc-webgl-chart/multiple-lines'); + cy.visit('/tests/webgl-chart/multiple-lines'); cy.viewport(CHART_SIZE.width, CHART_SIZE.height); cy.wait(WAIT_MS); cy.get('#test-container').matchImageSnapshotOnCI(); @@ -121,7 +121,7 @@ describe('line chart', () => { it('renders multiple data streams as disconnected lines, with lines and points overlapping', () => { // NOTE: Ensure that alpha channels are mixing properly within the overlapped region - cy.visit('/tests/sc-webgl-chart/multiple-lines-overlapping'); + cy.visit('/tests/webgl-chart/multiple-lines-overlapping'); cy.viewport(CHART_SIZE.width, CHART_SIZE.height); cy.wait(WAIT_MS); cy.get('#test-container').matchImageSnapshotOnCI(); diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/draggable-annotations.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/draggable-annotations.spec.ts index 2bfa1a8de..d906ace31 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/draggable-annotations.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/draggable-annotations.spec.ts @@ -45,7 +45,7 @@ const xAnnotation: XAnnotation = { }; const timelineParams: Partial = { - componentTag: 'sc-scatter-chart', + componentTag: 'iot-app-kit-vis-scatter-chart', viewportStart: X_MIN, viewportEnd: X_MAX, dataStreams: [ diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/empty-status.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/empty-status.spec.ts index 8f95d6374..6d8b2f326 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/empty-status.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/empty-status.spec.ts @@ -2,7 +2,7 @@ import { CHART_VIZ_CONTAINER_SELECTOR, visitDynamicWidget } from '../../../../sr import { DATA_STREAM } from '../../../../src/testing/__mocks__/mockWidgetProperties'; import { messageOverrides } from '../../../../src/testing/__mocks__/mockMessgeOverrides'; -const componentTag = 'sc-scatter-chart'; +const componentTag = 'iot-app-kit-vis-scatter-chart'; it('renders the "no streams present" messaging when no streams preset', () => { visitDynamicWidget(cy, { diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/errors.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/errors.spec.ts index 3d1f2fba8..d6472a6f8 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/errors.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/errors.spec.ts @@ -7,7 +7,7 @@ import { DATA_STREAM } from '../../../../src/testing/__mocks__/mockWidgetPropert it('displays error when there is an error', () => { visitDynamicWidget(cy, { - componentTag: 'sc-scatter-chart', + componentTag: 'iot-app-kit-vis-scatter-chart', dataStreams: [{ ...DATA_STREAM, error: 'beep beep SEV-2' }], }); diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/gestures.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/gestures.spec.ts index 40a3a8099..8ff26bbe7 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/gestures.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/gestures.spec.ts @@ -6,7 +6,7 @@ it('moves viewport when gestures are applied', () => { const OLD_Y_TICK_LABEL = 'Fri 31'; visitDynamicWidget(cy, { - componentTag: 'sc-scatter-chart', + componentTag: 'iot-app-kit-vis-scatter-chart', viewportStart: START, viewportEnd: END, gestures: true, @@ -29,7 +29,7 @@ it('does not move viewport when gestures are not applied', () => { const OLD_Y_TICK_LABEL = 'Fri 31'; visitDynamicWidget(cy, { - componentTag: 'sc-scatter-chart', + componentTag: 'iot-app-kit-vis-scatter-chart', viewportStart: START, viewportEnd: END, gestures: false, diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/loading.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/loading.spec.ts index b50071941..98c54c3ce 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/loading.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/loading.spec.ts @@ -3,7 +3,7 @@ import { DATA_STREAM } from '../../../../src/testing/__mocks__/mockWidgetPropert it('renders spinner', () => { visitDynamicWidget(cy, { - componentTag: 'sc-scatter-chart', + componentTag: 'iot-app-kit-vis-scatter-chart', dataStreams: [{ ...DATA_STREAM, isLoading: true }], }); diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/sc-webgl-scatter-chart.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/sc-webgl-scatter-chart.spec.ts index e16032af8..7ab02a895 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/sc-webgl-scatter-chart.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/sc-webgl-scatter-chart.spec.ts @@ -1,5 +1,5 @@ describe('scatter chart', () => { - const root = '/tests/sc-scatter-chart'; + const root = '/tests/scatter-chart'; const VIEWPORT_HEIGHT = 500; const VIEWPORT_WIDTH = 500; diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/threshold-coloration.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/threshold-coloration.spec.ts index a6469683c..833965ed6 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/threshold-coloration.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/threshold-coloration.spec.ts @@ -1,4 +1,4 @@ -const scRoot = '/tests/sc-scatter-chart'; +const scRoot = '/tests/scatter-chart'; // @ts-ignore const VIEWPORT_HEIGHT = 500; diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/tooltip.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/tooltip.spec.ts index 50165dbc9..fc5664863 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/tooltip.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/scatter-chart/tooltip.spec.ts @@ -16,7 +16,7 @@ import { it('renders no tooltip when only info is empty', () => { visitDynamicWidget(cy, { - componentTag: 'sc-scatter-chart', + componentTag: 'iot-app-kit-vis-scatter-chart', viewportStart: new Date(2000, 0, 0), viewportEnd: new Date(2000, 0, 0, 0, 5), dataStreams: [NUMBER_EMPTY_STREAM], @@ -36,7 +36,7 @@ it('renders no tooltip when only info is empty', () => { it('renders tooltip rows in order of values magnitude', () => { visitDynamicWidget(cy, { - componentTag: 'sc-scatter-chart', + componentTag: 'iot-app-kit-vis-scatter-chart', viewportStart: new Date(2000, 0, 0), viewportEnd: new Date(2000, 0, 0, 0, 5), dataStreams: [NUMBER_STREAM_1, NUMBER_EMPTY_STREAM, NUMBER_STREAM_2], @@ -82,7 +82,7 @@ it('renders tooltip rows in order of values magnitude', () => { it('renders tooltip to the left of the mouse when the mouse is on the right side', () => { visitDynamicWidget(cy, { - componentTag: 'sc-scatter-chart', + componentTag: 'iot-app-kit-vis-scatter-chart', viewportStart: new Date(new Date(2000, 0, 0).getTime() - MINUTE_IN_MS), viewportEnd: new Date(2000, 0, 0, 0, 5), dataStreams: [NUMBER_STREAM_1], diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/empty-status.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/empty-status.spec.ts index 8eec6a06e..f67aa149f 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/empty-status.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/empty-status.spec.ts @@ -2,7 +2,7 @@ import { CHART_VIZ_CONTAINER_SELECTOR, visitDynamicWidget } from '../../../../sr import { DATA_STREAM } from '../../../../src/testing/__mocks__/mockWidgetProperties'; import { messageOverrides } from '../../../../src/testing/__mocks__/mockMessgeOverrides'; -const componentTag = 'sc-status-timeline'; +const componentTag = 'iot-app-kit-vis-status-timeline'; it('renders the "no streams present" messaging when no streams preset', () => { visitDynamicWidget(cy, { diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/errors.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/errors.spec.ts index 69ff385d9..9dcb0a082 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/errors.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/errors.spec.ts @@ -7,7 +7,7 @@ import { DATA_STREAM } from '../../../../src/testing/__mocks__/mockWidgetPropert it('displays error when there is an error', () => { visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', dataStreams: [{ ...DATA_STREAM, error: 'beep beep SEV-2' }], }); @@ -20,7 +20,7 @@ it('displays error when there is an error', () => { it('truncates long error message', () => { visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', dataStreams: [ { ...DATA_STREAM, error: 'a really really really really really long and not very useful error message.' }, ], diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/gestures.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/gestures.spec.ts index 886220aef..37e2dd55e 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/gestures.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/gestures.spec.ts @@ -6,7 +6,7 @@ it('moves viewport when gestures are applied', () => { const OLD_Y_TICK_LABEL = 'Fri 31'; visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', viewportStart: START, viewportEnd: END, gestures: true, @@ -29,7 +29,7 @@ it('does not move viewport when gestures are not applied', () => { const OLD_Y_TICK_LABEL = 'Fri 31'; visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', viewportStart: START, viewportEnd: END, gestures: false, diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/loading.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/loading.spec.ts index af29ce4d4..f73ce2ebf 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/loading.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/loading.spec.ts @@ -3,7 +3,7 @@ import { DATA_STREAM } from '../../../../src/testing/__mocks__/mockWidgetPropert it('renders spinner', () => { visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', dataStreams: [{ ...DATA_STREAM, isLoading: true }], }); diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/status-timeline.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/status-timeline.spec.ts index d9924a203..be570e752 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/status-timeline.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/status-timeline.spec.ts @@ -30,7 +30,7 @@ describe('status timeline', () => { const viewportStart = new Date(2000, 0, 0); const viewportEnd = new Date(2000, 0, 1); const timelineParams: Partial = { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', viewportStart, viewportEnd, dataStreams: [ @@ -69,7 +69,7 @@ describe('status timeline', () => { unit: 'mph', }; visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', alarms: { expires: MINUTE_IN_MS }, dataStreams: [ { @@ -88,7 +88,7 @@ describe('status timeline', () => { describe('isEditing', () => { it('edits a info name while `isEditing` is true', () => { visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', alarms: { expires: MINUTE_IN_MS }, isEditing: true, dataStreams: [DATA_STREAM], @@ -123,7 +123,7 @@ describe('status timeline', () => { })); visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', alarms: { expires: MINUTE_IN_MS }, dataStreams, }); @@ -150,7 +150,7 @@ describe('status timeline', () => { const dataStreamInfos = createInfos(3); // Maximum that can fit within a chart the given size visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', alarms: { expires: MINUTE_IN_MS }, dataStreams: dataStreamInfos.map(info => ({ ...info, data: [] })), }); @@ -172,7 +172,7 @@ describe('status timeline', () => { })); // Maximum that can fit within a chart the given size visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', alarms: { expires: MINUTE_IN_MS }, dataStreams: dataStreamInfos.map(info => ({ ...info, data: [] })), }); @@ -326,14 +326,14 @@ describe('mesh', () => { const WAIT_MS = SECOND_IN_MS * 2; it('renders a single status', () => { - cy.visit('/tests/sc-webgl-chart/single-status'); + cy.visit('/tests/webgl-chart/single-status'); cy.viewport(CHART_SIZE.width, CHART_SIZE.height); cy.wait(WAIT_MS); cy.get('#test-container').matchImageSnapshotOnCI(); }); it('renders multiple data streams as parallel status timelines', () => { - cy.visit('/tests/sc-webgl-chart/multiple-statuses'); + cy.visit('/tests/webgl-chart/multiple-statuses'); cy.viewport(200, 200); cy.wait(WAIT_MS); cy.get('#test-container').matchImageSnapshotOnCI(); diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/threshold-legend.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/threshold-legend.spec.ts index 16da21329..cd00cdeb5 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/threshold-legend.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/threshold-legend.spec.ts @@ -22,19 +22,19 @@ it('renders threshold legend', () => { }; visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', annotations: { y: [eqThreshold], }, }); - cy.get('sc-threshold-legend').should('be.visible'); - cy.get('sc-threshold-legend-row').should('be.visible'); - cy.get('sc-threshold-legend-row').should('have.length', 1); + cy.get('iot-app-kit-vis-threshold-legend').should('be.visible'); + cy.get('iot-app-kit-vis-threshold-legend-row').should('be.visible'); + cy.get('iot-app-kit-vis-threshold-legend-row').should('have.length', 1); - cy.contains('sc-threshold-legend-row', eqThreshold.value).should('be.visible'); + cy.contains('iot-app-kit-vis-threshold-legend-row', eqThreshold.value).should('be.visible'); - cy.get('sc-threshold-legend').matchImageSnapshotOnCI(); + cy.get('iot-app-kit-vis-threshold-legend').matchImageSnapshotOnCI(); }); it('renders many thresholds at once', () => { @@ -42,7 +42,7 @@ it('renders many thresholds at once', () => { const thresholds = createUniqueThresholds(NUM_THRESHOLDS); visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', annotations: { y: thresholds, }, @@ -60,7 +60,7 @@ it('does not render annotations (that are not thresholds)', () => { }; visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', annotations: { y: [annotation], }, @@ -68,5 +68,5 @@ it('does not render annotations (that are not thresholds)', () => { cy.waitForStatusTimeline(); - cy.contains('sc-threshold-legend-row').should('have.length', 0); + cy.contains('iot-app-kit-vis-threshold-legend-row').should('have.length', 0); }); diff --git a/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/tooltip.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/tooltip.spec.ts index 4d52b053e..0177bd759 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/tooltip.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/charts/status-timeline/tooltip.spec.ts @@ -21,7 +21,7 @@ import { ANNOTATIONS } from '../../../../src/testing/dynamicWidgetUtils/constant it('renders with tooltip for multiple data streams with order in which they were added', () => { // tooltip position is based on info order, *not* data order. visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', viewportStart: new Date(2000, 0, 0), viewportEnd: new Date(2000, 0, 0, 0, 5), dataStreams: [STRING_STREAM_1, NUMBER_EMPTY_STREAM, STRING_STREAM_2], @@ -76,7 +76,7 @@ it('renders with tooltip for multiple data streams with order in which they were it('renders tooltip to the left of the mouse when the mouse is on the right side', () => { visitDynamicWidget(cy, { - componentTag: 'sc-status-timeline', + componentTag: 'iot-app-kit-vis-status-timeline', viewportStart: new Date(new Date(2000, 0, 0).getTime() - MINUTE_IN_MS), viewportEnd: new Date(2000, 0, 0, 0, 5), dataStreams: [NUMBER_STREAM_1], diff --git a/packages/iot-app-kit-visualizations/cypress/integration/expandable-input.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/expandable-input.spec.ts index cc1c5e13f..c14b7d7ba 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/expandable-input.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/expandable-input.spec.ts @@ -1,4 +1,4 @@ -const subRoot = '/tests/sc-expandable-input/standard'; +const subRoot = '/tests/expandable-input/standard'; it('onValueChange is invoked only after blur', () => { cy.visit(subRoot); const SOME_TEXT = 'some text'; diff --git a/packages/iot-app-kit-visualizations/cypress/integration/size-provider.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/size-provider.spec.ts index 89ba88c52..ba99634f2 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/size-provider.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/size-provider.spec.ts @@ -1,11 +1,11 @@ import { DEFAULT_SIZE, SHIFT_X_DIFF } from '../../src/testing/test-routes/sc-size-provider/constants'; import { SECOND_IN_MS } from '../../src/utils/time'; -const root = '/tests/sc-sizer-provider/sc-size-provider-standard'; +const root = '/tests/sizer-provider/size-provider-standard'; it('child of widget sizer inherits size-providers parent size', () => { cy.visit(root); - cy.get('sc-box > .box-container') + cy.get('iot-app-kit-vis-box > .box-container') .should('be.visible') .should($el => { expect($el).to.have.css('width', `${DEFAULT_SIZE.width}px`); @@ -18,14 +18,14 @@ it('on update of the size-providers parent size, the child of widget sizer has i const UPDATED_HEIGHT = 8000; cy.visit(root); - cy.get('sc-box > .box-container').should('be.visible'); + cy.get('iot-app-kit-vis-box > .box-container').should('be.visible'); cy.get('#container').then(div => { div.css('width', `${UPDATED_WIDTH}px`); div.css('height', `${UPDATED_HEIGHT}px`); }); - cy.get('sc-box > .box-container').should($el => { + cy.get('iot-app-kit-vis-box > .box-container').should($el => { expect($el).to.have.css('width', `${UPDATED_WIDTH}px`); expect($el).to.have.css('height', `${UPDATED_HEIGHT}px`); }); @@ -33,17 +33,17 @@ it('on update of the size-providers parent size, the child of widget sizer has i it('the position of the component is accurately set on initial render', () => { cy.visit(root); - cy.get('sc-box > .box-container').should('be.visible'); + cy.get('iot-app-kit-vis-box > .box-container').should('be.visible'); let INITIAL_RECT: DOMRect; - cy.get('sc-box > .box-container') + cy.get('iot-app-kit-vis-box > .box-container') .should('be.visible') - .get('sc-box') + .get('iot-app-kit-vis-box') .then(el => { INITIAL_RECT = el[0].getBoundingClientRect(); }); - cy.get('sc-box > .box-container').should($el => { + cy.get('iot-app-kit-vis-box > .box-container').should($el => { expect($el).to.have.attr('data-x', INITIAL_RECT.x.toString()); expect($el).to.have.attr('data-y', INITIAL_RECT.y.toString()); expect($el).to.have.attr('data-left', INITIAL_RECT.left.toString()); @@ -61,9 +61,9 @@ it('the position of the component is unchanged by scrolling vertically', () => { cy.viewport(700, 700); let INITIAL_RECT: DOMRect; - cy.get('sc-box > .box-container') + cy.get('iot-app-kit-vis-box > .box-container') .should('be.visible') - .get('sc-box') + .get('iot-app-kit-vis-box') .then(el => { INITIAL_RECT = el[0].getBoundingClientRect(); }); @@ -71,7 +71,7 @@ it('the position of the component is unchanged by scrolling vertically', () => { cy.scrollTo('bottom'); cy.wait(0.5 * SECOND_IN_MS) - .get('sc-box > .box-container') + .get('iot-app-kit-vis-box > .box-container') .should($el => { expect($el).to.have.attr('data-x', INITIAL_RECT.x.toString()); expect($el).to.have.attr('data-y', INITIAL_RECT.y.toString()); @@ -88,9 +88,9 @@ it('the position of the component is unchanged by scrolling horizontally', () => cy.viewport(700, 700); let INITIAL_RECT: DOMRect; - cy.get('sc-box > .box-container') + cy.get('iot-app-kit-vis-box > .box-container') .should('be.visible') - .get('sc-box') + .get('iot-app-kit-vis-box') .then(el => { INITIAL_RECT = el[0].getBoundingClientRect(); }); @@ -98,7 +98,7 @@ it('the position of the component is unchanged by scrolling horizontally', () => cy.scrollTo('right'); cy.wait(0.5 * SECOND_IN_MS) - .get('sc-box > .box-container') + .get('iot-app-kit-vis-box > .box-container') .should($el => { expect($el).to.have.attr('data-x', INITIAL_RECT.x.toString()); expect($el).to.have.attr('data-y', INITIAL_RECT.y.toString()); @@ -114,9 +114,9 @@ it('the position of the component is updated after being shifted', () => { cy.visit(root); let INITIAL_RECT: DOMRect; - cy.get('sc-box > .box-container') + cy.get('iot-app-kit-vis-box > .box-container') .should('be.visible') - .get('sc-box') + .get('iot-app-kit-vis-box') .then(el => { INITIAL_RECT = el[0].getBoundingClientRect(); }); @@ -124,7 +124,7 @@ it('the position of the component is updated after being shifted', () => { cy.get('#shift-right').click(); cy.wait(0.5 * SECOND_IN_MS) - .get('sc-box > .box-container') + .get('iot-app-kit-vis-box > .box-container') .should($el => { expect($el).to.have.attr('data-x', (INITIAL_RECT.x + SHIFT_X_DIFF).toString()); expect($el).to.have.attr('data-y', INITIAL_RECT.y.toString()); diff --git a/packages/iot-app-kit-visualizations/cypress/integration/webglContext.spec.ts b/packages/iot-app-kit-visualizations/cypress/integration/webglContext.spec.ts index 10a4a2cf4..197860359 100644 --- a/packages/iot-app-kit-visualizations/cypress/integration/webglContext.spec.ts +++ b/packages/iot-app-kit-visualizations/cypress/integration/webglContext.spec.ts @@ -1,6 +1,6 @@ import { SECOND_IN_MS } from '../../src/utils/time'; -const root = '/tests/sc-webgl-chart'; +const root = '/tests/webgl-chart'; const addChartToFront = (cy: Cypress.cy) => { cy.get('#add-chart-to-front').click(); @@ -30,7 +30,7 @@ const removeChartFromFront = (cy: Cypress.cy) => { }; it('renders data on canvas', () => { - cy.visit(`${root}/sc-webgl-chart-dynamic-charts`); + cy.visit(`${root}/webgl-chart-dynamic-charts`); addChartToFront(cy); cy.get('.data-container').should('be.visible'); @@ -38,7 +38,7 @@ it('renders data on canvas', () => { }); it('shifts visualized data to the right', () => { - cy.visit(`${root}/sc-webgl-chart-dynamic-charts`); + cy.visit(`${root}/webgl-chart-dynamic-charts`); addChartToFront(cy); cy.get('.data-container').should('be.visible'); shiftRight(cy); @@ -49,7 +49,7 @@ it('shifts visualized data to the right', () => { }); it('shifts visualized data to the left', () => { - cy.visit(`${root}/sc-webgl-chart-dynamic-charts`); + cy.visit(`${root}/webgl-chart-dynamic-charts`); addChartToFront(cy); cy.get('.data-container').should('be.visible'); shiftRight(cy); @@ -61,7 +61,7 @@ it('shifts visualized data to the left', () => { }); it('clears canvas when a single chart is unmounted', () => { - cy.visit(`${root}/sc-webgl-chart-dynamic-charts`); + cy.visit(`${root}/webgl-chart-dynamic-charts`); addChartToFront(cy); cy.get('.data-container').should('be.visible'); removeChartFromFront(cy); @@ -73,7 +73,7 @@ it('clears canvas when a single chart is unmounted', () => { }); it('with two charts, removing the back chart should clean up the canvas', () => { - cy.visit(`${root}/sc-webgl-chart-dynamic-charts`); + cy.visit(`${root}/webgl-chart-dynamic-charts`); addChartToFront(cy); addChartToFront(cy); cy.get('.data-container').should('be.visible'); @@ -85,7 +85,7 @@ it('with two charts, removing the back chart should clean up the canvas', () => }); it('with two charts, removing the front chart should clean up the canvas', () => { - cy.visit(`${root}/sc-webgl-chart-dynamic-charts`); + cy.visit(`${root}/webgl-chart-dynamic-charts`); addChartToFront(cy); addChartToFront(cy); cy.get('.data-container').should('be.visible'); diff --git a/packages/iot-app-kit-visualizations/src/components.d.ts b/packages/iot-app-kit-visualizations/src/components.d.ts index 8a64a087a..e279319b1 100644 --- a/packages/iot-app-kit-visualizations/src/components.d.ts +++ b/packages/iot-app-kit-visualizations/src/components.d.ts @@ -14,19 +14,13 @@ import { RectScrollFixed } from "./utils/types"; import { ChartSceneCreator, ChartSceneUpdater } from "./components/charts/sc-webgl-base-chart/types"; import { DataType } from "./utils/dataConstants"; export namespace Components { - interface LineChartUnsupportedDataTypes { - } - interface LineChartViewportChange { - } - interface MultipleStatuses { - } - interface ScAngledLineSegment { + interface IotAppKitVisAngledLineSegment { } - interface ScAnnotationsDraggableMulti { + interface IotAppKitVisAnnotationsDraggableMulti { } - interface ScApp { + interface IotAppKitVisApp { } - interface ScBarChart { + interface IotAppKitVisBarChart { "alarms"?: AlarmsConfig; "annotations": Annotations; "axis"?: Axis.Options; @@ -54,21 +48,21 @@ export namespace Components { "viewport": MinimalViewPortConfig; "widgetId": string; } - interface ScBox { + interface IotAppKitVisBox { "size": MinimalSizeConfig; "someObject"?: Object; } - interface ScChartIcon { + interface IotAppKitVisChartIcon { "color"?: string; "name": StatusIcon; "size"?: number; } - interface ScChartYRange { + interface IotAppKitVisChartYRange { "component": string; } - interface ScCirclePointShaders { + interface IotAppKitVisCirclePointShaders { } - interface ScDataStreamName { + interface IotAppKitVisDataStreamName { "date"?: Date; "detailedLabel"?: string; "displayTooltip"?: boolean; @@ -77,21 +71,21 @@ export namespace Components { "onNameChange": (name: string) => void; "pointType"?: POINT_TYPE; } - interface ScErrorBadge { + interface IotAppKitVisErrorBadge { } - interface ScExpandableInput { + interface IotAppKitVisExpandableInput { "isDisabled"?: boolean; "onValueChange": (value: string) => void; "value": string; } - interface ScExpandableInputStandard { + interface IotAppKitVisExpandableInputStandard { } - interface ScGestureHandler { + interface IotAppKitVisGestureHandler { "onDateRangeChange": ({ end, start }: { start: Date; end: Date }) => void; "size": SizeConfig; "viewport": ViewPort; } - interface ScLegend { + interface IotAppKitVisLegend { "config": LegendConfig; "dataStreams": DataStream[]; "isEditing": boolean; @@ -104,7 +98,7 @@ export namespace Components { "viewport": ViewPort; "visualizesAlarms": boolean; } - interface ScLegendRow { + interface IotAppKitVisLegendRow { "color": string; "detailedLabel"?: string; "icon"?: StatusIcon; @@ -119,7 +113,7 @@ export namespace Components { "updateDataStreamName": ({ streamId, name }: { streamId: string; name: string }) => void; "valueColor"?: string; } - interface ScLineChart { + interface IotAppKitVisLineChart { "alarms"?: AlarmsConfig; "annotations": Annotations; "axis"?: Axis.Options; @@ -147,21 +141,21 @@ export namespace Components { "viewport": MinimalViewPortConfig; "widgetId": string; } - interface ScLineChartColoredPoint { + interface IotAppKitVisLineChartColoredPoint { } - interface ScLineChartStreamData { + interface IotAppKitVisLineChartStreamData { } - interface ScLoadingSpinner { + interface IotAppKitVisLoadingSpinner { "dark"?: boolean; "size"?: number; } - interface ScMultipleBars { + interface IotAppKitVisMultipleBars { } - interface ScMultipleLines { + interface IotAppKitVisMultipleLines { } - interface ScMultipleLinesOverlapping { + interface IotAppKitVisMultipleLinesOverlapping { } - interface ScScatterChart { + interface IotAppKitVisScatterChart { "alarms"?: AlarmsConfig; "annotations": Annotations; "axis"?: Axis.Options; @@ -189,42 +183,42 @@ export namespace Components { "viewport": MinimalViewPortConfig; "widgetId": string; } - interface ScScatterChartDynamicData { + interface IotAppKitVisScatterChartDynamicData { } - interface ScScatterChartThreshold { + interface IotAppKitVisScatterChartThreshold { } - interface ScScatterChartThresholdColorationBand { + interface IotAppKitVisScatterChartThresholdColorationBand { } - interface ScScatterChartThresholdColorationExactPoint { + interface IotAppKitVisScatterChartThresholdColorationExactPoint { } - interface ScScatterChartThresholdColorationMultipleDataStream { + interface IotAppKitVisScatterChartThresholdColorationMultipleDataStream { } - interface ScScatterChartThresholdColorationMultipleThresholds { + interface IotAppKitVisScatterChartThresholdColorationMultipleThresholds { } - interface ScScatterChartThresholdNoColoration { + interface IotAppKitVisScatterChartThresholdNoColoration { } - interface ScScatterChartTooltipWithMultipleDataStreamsAndTrends { + interface IotAppKitVisScatterChartTooltipWithMultipleDataStreamsAndTrends { } - interface ScScatterChartTrendLineColorConfiguration { + interface IotAppKitVisScatterChartTrendLineColorConfiguration { } - interface ScScatterChartTrendLineWithLegend { + interface IotAppKitVisScatterChartTrendLineWithLegend { } - interface ScScatterChartUnsupportedDataTypes { + interface IotAppKitVisScatterChartUnsupportedDataTypes { } - interface ScSingleBar { + interface IotAppKitVisSingleBar { } - interface ScSingleColoredBar { + interface IotAppKitVisSingleColoredBar { } - interface ScSizeProvider { + interface IotAppKitVisSizeProvider { "renderFunc": (rect: RectScrollFixed) => void; /** * Size overrides. these will take precident over any auto-calculated sizing */ "size"?: MinimalSizeConfig; } - interface ScSizeProviderStandard { + interface IotAppKitVisSizeProviderStandard { } - interface ScStatusTimeline { + interface IotAppKitVisStatusTimeline { "alarms"?: AlarmsConfig; "annotations"?: Annotations; "axis"?: Axis.Options; @@ -250,7 +244,7 @@ export namespace Components { "viewport": MinimalViewPortConfig; "widgetId": string; } - interface ScStatusTimelineOverlay { + interface IotAppKitVisStatusTimelineOverlay { "dataStreams": DataStream[]; "date": Date; "isEditing": boolean; @@ -258,7 +252,7 @@ export namespace Components { "thresholds": Threshold[]; "widgetId": string; } - interface ScStatusTimelineOverlayRow { + interface IotAppKitVisStatusTimelineOverlayRow { "detailedLabel"?: string; "icon"?: StatusIcon; "isEditing": boolean; @@ -268,18 +262,18 @@ export namespace Components { "value"?: Primitive; "valueColor"?: string; } - interface ScStraightLineSegment { + interface IotAppKitVisStraightLineSegment { } - interface ScStraightLineSegmentColored { + interface IotAppKitVisStraightLineSegmentColored { } - interface ScThresholdLegend { + interface IotAppKitVisThresholdLegend { "thresholds": Threshold[]; } - interface ScThresholdLegendRow { + interface IotAppKitVisThresholdLegendRow { "color": string; "label": string; } - interface ScTooltip { + interface IotAppKitVisTooltip { /** * If we are drawing data from the data timestamp to timestamp + resolution we want the tooltip to align on the left side Otherwise we are drawing the data from timestamp - resolution to timestamp then we want the tooltip to align on the right side */ @@ -301,7 +295,7 @@ export namespace Components { "viewport": ViewPort; "visualizesAlarms": boolean; } - interface ScTooltipRow { + interface IotAppKitVisTooltipRow { "aggregationType"?: string; "color": string; "icon"?: StatusIcon; @@ -312,7 +306,7 @@ export namespace Components { "showDataStreamColor": boolean; "valueColor"?: string; } - interface ScTooltipRows { + interface IotAppKitVisTooltipRows { /** * If we are drawing data from the data timestamp to timestamp + resolution we want the tooltip to align on the left side Otherwise we are drawing the data from timestamp - resolution to timestamp then we want the tooltip to align on the right side */ @@ -334,42 +328,42 @@ export namespace Components { "viewport": ViewPort; "visualizesAlarms": boolean; } - interface ScWebglAxis { + interface IotAppKitVisWebglAxis { "size": SizeConfig; } - interface ScWebglBarChartDynamicBuffer { + interface IotAppKitVisWebglBarChartDynamicBuffer { } - interface ScWebglBarChartDynamicData { + interface IotAppKitVisWebglBarChartDynamicData { } - interface ScWebglBarChartDynamicDataStreams { + interface IotAppKitVisWebglBarChartDynamicDataStreams { } - interface ScWebglBarChartFastViewport { + interface IotAppKitVisWebglBarChartFastViewport { } - interface ScWebglBarChartMargin { + interface IotAppKitVisWebglBarChartMargin { } - interface ScWebglBarChartNegative { + interface IotAppKitVisWebglBarChartNegative { } - interface ScWebglBarChartPositiveNegative { + interface IotAppKitVisWebglBarChartPositiveNegative { } - interface ScWebglBarChartStandard { + interface IotAppKitVisWebglBarChartStandard { } - interface ScWebglBarChartStartFromZero { + interface IotAppKitVisWebglBarChartStartFromZero { } - interface ScWebglBarChartThresholdColoration { + interface IotAppKitVisWebglBarChartThresholdColoration { } - interface ScWebglBarChartThresholdColorationBand { + interface IotAppKitVisWebglBarChartThresholdColorationBand { } - interface ScWebglBarChartThresholdColorationExactPoint { + interface IotAppKitVisWebglBarChartThresholdColorationExactPoint { } - interface ScWebglBarChartThresholdColorationMultipleDataStream { + interface IotAppKitVisWebglBarChartThresholdColorationMultipleDataStream { } - interface ScWebglBarChartThresholdColorationMultipleThresholds { + interface IotAppKitVisWebglBarChartThresholdColorationMultipleThresholds { } - interface ScWebglBarChartThresholdNoColoration { + interface IotAppKitVisWebglBarChartThresholdNoColoration { } - interface ScWebglBarChartUnsupportedDataTypes { + interface IotAppKitVisWebglBarChartUnsupportedDataTypes { } - interface ScWebglBaseChart { + interface IotAppKitVisWebglBaseChart { "alarms"?: AlarmsConfig; "annotations": Annotations; "axis"?: Axis.Options; @@ -409,53 +403,59 @@ export namespace Components { "visualizesAlarms": boolean; "yRangeStartFromZero": boolean; } - interface ScWebglChartAnnotationEditable { + interface IotAppKitVisWebglChartAnnotationEditable { } - interface ScWebglChartAnnotations { + interface IotAppKitVisWebglChartAnnotations { } - interface ScWebglChartAnnotationsAlwaysInViewport { + interface IotAppKitVisWebglChartAnnotationsAlwaysInViewport { } - interface ScWebglChartAxis { + interface IotAppKitVisWebglChartAxis { } - interface ScWebglChartDynamicCharts { + interface IotAppKitVisWebglChartDynamicCharts { } - interface ScWebglChartLargeViewport { + interface IotAppKitVisWebglChartLargeViewport { } - interface ScWebglChartMulti { + interface IotAppKitVisWebglChartMulti { } - interface ScWebglChartNoAnnotations { + interface IotAppKitVisWebglChartNoAnnotations { } - interface ScWebglChartStandard { + interface IotAppKitVisWebglChartStandard { } - interface ScWebglChartStandardWithLegend { + interface IotAppKitVisWebglChartStandardWithLegend { } - interface ScWebglChartStandardWithLegendOnRight { + interface IotAppKitVisWebglChartStandardWithLegendOnRight { } - interface ScWebglChartThresholdColorationBand { + interface IotAppKitVisWebglChartThresholdColorationBand { } - interface ScWebglChartThresholdColorationExactPoint { + interface IotAppKitVisWebglChartThresholdColorationExactPoint { } - interface ScWebglChartThresholdColorationMultipleDataStream { + interface IotAppKitVisWebglChartThresholdColorationMultipleDataStream { } - interface ScWebglChartThresholdColorationMultipleThresholds { + interface IotAppKitVisWebglChartThresholdColorationMultipleThresholds { } - interface ScWebglChartThresholdColorationSplitHalf { + interface IotAppKitVisWebglChartThresholdColorationSplitHalf { } - interface ScWebglChartTooltipWithMultipleDataStreams { + interface IotAppKitVisWebglChartTooltipWithMultipleDataStreams { } - interface ScWebglContext { + interface IotAppKitVisWebglContext { "onContextInitialization": (context: WebGLRenderingContext) => void; "viewFrame": HTMLElement | Window | undefined; } - interface ScWebglContextNested { + interface IotAppKitVisWebglContextNested { } - interface ScWebglContextRoot { + interface IotAppKitVisWebglContextRoot { } - interface ScWebglLineChartDynamicBuffer { + interface IotAppKitVisWebglLineChartDynamicBuffer { } - interface ScWebglLineChartDynamicData { + interface IotAppKitVisWebglLineChartDynamicData { } - interface ScWebglLineChartDynamicDataStreams { + interface IotAppKitVisWebglLineChartDynamicDataStreams { + } + interface LineChartUnsupportedDataTypes { + } + interface LineChartViewportChange { + } + interface MultipleStatuses { } interface SingleColoredStatus { } @@ -497,557 +497,557 @@ export namespace Components { } } declare global { - interface HTMLLineChartUnsupportedDataTypesElement extends Components.LineChartUnsupportedDataTypes, HTMLStencilElement { + interface HTMLIotAppKitVisAngledLineSegmentElement extends Components.IotAppKitVisAngledLineSegment, HTMLStencilElement { } - var HTMLLineChartUnsupportedDataTypesElement: { - prototype: HTMLLineChartUnsupportedDataTypesElement; - new (): HTMLLineChartUnsupportedDataTypesElement; + var HTMLIotAppKitVisAngledLineSegmentElement: { + prototype: HTMLIotAppKitVisAngledLineSegmentElement; + new (): HTMLIotAppKitVisAngledLineSegmentElement; }; - interface HTMLLineChartViewportChangeElement extends Components.LineChartViewportChange, HTMLStencilElement { + interface HTMLIotAppKitVisAnnotationsDraggableMultiElement extends Components.IotAppKitVisAnnotationsDraggableMulti, HTMLStencilElement { } - var HTMLLineChartViewportChangeElement: { - prototype: HTMLLineChartViewportChangeElement; - new (): HTMLLineChartViewportChangeElement; + var HTMLIotAppKitVisAnnotationsDraggableMultiElement: { + prototype: HTMLIotAppKitVisAnnotationsDraggableMultiElement; + new (): HTMLIotAppKitVisAnnotationsDraggableMultiElement; }; - interface HTMLMultipleStatusesElement extends Components.MultipleStatuses, HTMLStencilElement { + interface HTMLIotAppKitVisAppElement extends Components.IotAppKitVisApp, HTMLStencilElement { } - var HTMLMultipleStatusesElement: { - prototype: HTMLMultipleStatusesElement; - new (): HTMLMultipleStatusesElement; + var HTMLIotAppKitVisAppElement: { + prototype: HTMLIotAppKitVisAppElement; + new (): HTMLIotAppKitVisAppElement; }; - interface HTMLScAngledLineSegmentElement extends Components.ScAngledLineSegment, HTMLStencilElement { + interface HTMLIotAppKitVisBarChartElement extends Components.IotAppKitVisBarChart, HTMLStencilElement { } - var HTMLScAngledLineSegmentElement: { - prototype: HTMLScAngledLineSegmentElement; - new (): HTMLScAngledLineSegmentElement; + var HTMLIotAppKitVisBarChartElement: { + prototype: HTMLIotAppKitVisBarChartElement; + new (): HTMLIotAppKitVisBarChartElement; }; - interface HTMLScAnnotationsDraggableMultiElement extends Components.ScAnnotationsDraggableMulti, HTMLStencilElement { + interface HTMLIotAppKitVisBoxElement extends Components.IotAppKitVisBox, HTMLStencilElement { } - var HTMLScAnnotationsDraggableMultiElement: { - prototype: HTMLScAnnotationsDraggableMultiElement; - new (): HTMLScAnnotationsDraggableMultiElement; + var HTMLIotAppKitVisBoxElement: { + prototype: HTMLIotAppKitVisBoxElement; + new (): HTMLIotAppKitVisBoxElement; }; - interface HTMLScAppElement extends Components.ScApp, HTMLStencilElement { + interface HTMLIotAppKitVisChartIconElement extends Components.IotAppKitVisChartIcon, HTMLStencilElement { } - var HTMLScAppElement: { - prototype: HTMLScAppElement; - new (): HTMLScAppElement; + var HTMLIotAppKitVisChartIconElement: { + prototype: HTMLIotAppKitVisChartIconElement; + new (): HTMLIotAppKitVisChartIconElement; }; - interface HTMLScBarChartElement extends Components.ScBarChart, HTMLStencilElement { + interface HTMLIotAppKitVisChartYRangeElement extends Components.IotAppKitVisChartYRange, HTMLStencilElement { } - var HTMLScBarChartElement: { - prototype: HTMLScBarChartElement; - new (): HTMLScBarChartElement; + var HTMLIotAppKitVisChartYRangeElement: { + prototype: HTMLIotAppKitVisChartYRangeElement; + new (): HTMLIotAppKitVisChartYRangeElement; }; - interface HTMLScBoxElement extends Components.ScBox, HTMLStencilElement { + interface HTMLIotAppKitVisCirclePointShadersElement extends Components.IotAppKitVisCirclePointShaders, HTMLStencilElement { } - var HTMLScBoxElement: { - prototype: HTMLScBoxElement; - new (): HTMLScBoxElement; + var HTMLIotAppKitVisCirclePointShadersElement: { + prototype: HTMLIotAppKitVisCirclePointShadersElement; + new (): HTMLIotAppKitVisCirclePointShadersElement; }; - interface HTMLScChartIconElement extends Components.ScChartIcon, HTMLStencilElement { + interface HTMLIotAppKitVisDataStreamNameElement extends Components.IotAppKitVisDataStreamName, HTMLStencilElement { } - var HTMLScChartIconElement: { - prototype: HTMLScChartIconElement; - new (): HTMLScChartIconElement; + var HTMLIotAppKitVisDataStreamNameElement: { + prototype: HTMLIotAppKitVisDataStreamNameElement; + new (): HTMLIotAppKitVisDataStreamNameElement; }; - interface HTMLScChartYRangeElement extends Components.ScChartYRange, HTMLStencilElement { + interface HTMLIotAppKitVisErrorBadgeElement extends Components.IotAppKitVisErrorBadge, HTMLStencilElement { } - var HTMLScChartYRangeElement: { - prototype: HTMLScChartYRangeElement; - new (): HTMLScChartYRangeElement; + var HTMLIotAppKitVisErrorBadgeElement: { + prototype: HTMLIotAppKitVisErrorBadgeElement; + new (): HTMLIotAppKitVisErrorBadgeElement; }; - interface HTMLScCirclePointShadersElement extends Components.ScCirclePointShaders, HTMLStencilElement { + interface HTMLIotAppKitVisExpandableInputElement extends Components.IotAppKitVisExpandableInput, HTMLStencilElement { } - var HTMLScCirclePointShadersElement: { - prototype: HTMLScCirclePointShadersElement; - new (): HTMLScCirclePointShadersElement; + var HTMLIotAppKitVisExpandableInputElement: { + prototype: HTMLIotAppKitVisExpandableInputElement; + new (): HTMLIotAppKitVisExpandableInputElement; }; - interface HTMLScDataStreamNameElement extends Components.ScDataStreamName, HTMLStencilElement { + interface HTMLIotAppKitVisExpandableInputStandardElement extends Components.IotAppKitVisExpandableInputStandard, HTMLStencilElement { } - var HTMLScDataStreamNameElement: { - prototype: HTMLScDataStreamNameElement; - new (): HTMLScDataStreamNameElement; + var HTMLIotAppKitVisExpandableInputStandardElement: { + prototype: HTMLIotAppKitVisExpandableInputStandardElement; + new (): HTMLIotAppKitVisExpandableInputStandardElement; }; - interface HTMLScErrorBadgeElement extends Components.ScErrorBadge, HTMLStencilElement { + interface HTMLIotAppKitVisGestureHandlerElement extends Components.IotAppKitVisGestureHandler, HTMLStencilElement { } - var HTMLScErrorBadgeElement: { - prototype: HTMLScErrorBadgeElement; - new (): HTMLScErrorBadgeElement; + var HTMLIotAppKitVisGestureHandlerElement: { + prototype: HTMLIotAppKitVisGestureHandlerElement; + new (): HTMLIotAppKitVisGestureHandlerElement; }; - interface HTMLScExpandableInputElement extends Components.ScExpandableInput, HTMLStencilElement { + interface HTMLIotAppKitVisLegendElement extends Components.IotAppKitVisLegend, HTMLStencilElement { } - var HTMLScExpandableInputElement: { - prototype: HTMLScExpandableInputElement; - new (): HTMLScExpandableInputElement; + var HTMLIotAppKitVisLegendElement: { + prototype: HTMLIotAppKitVisLegendElement; + new (): HTMLIotAppKitVisLegendElement; }; - interface HTMLScExpandableInputStandardElement extends Components.ScExpandableInputStandard, HTMLStencilElement { + interface HTMLIotAppKitVisLegendRowElement extends Components.IotAppKitVisLegendRow, HTMLStencilElement { } - var HTMLScExpandableInputStandardElement: { - prototype: HTMLScExpandableInputStandardElement; - new (): HTMLScExpandableInputStandardElement; + var HTMLIotAppKitVisLegendRowElement: { + prototype: HTMLIotAppKitVisLegendRowElement; + new (): HTMLIotAppKitVisLegendRowElement; }; - interface HTMLScGestureHandlerElement extends Components.ScGestureHandler, HTMLStencilElement { + interface HTMLIotAppKitVisLineChartElement extends Components.IotAppKitVisLineChart, HTMLStencilElement { } - var HTMLScGestureHandlerElement: { - prototype: HTMLScGestureHandlerElement; - new (): HTMLScGestureHandlerElement; + var HTMLIotAppKitVisLineChartElement: { + prototype: HTMLIotAppKitVisLineChartElement; + new (): HTMLIotAppKitVisLineChartElement; }; - interface HTMLScLegendElement extends Components.ScLegend, HTMLStencilElement { + interface HTMLIotAppKitVisLineChartColoredPointElement extends Components.IotAppKitVisLineChartColoredPoint, HTMLStencilElement { } - var HTMLScLegendElement: { - prototype: HTMLScLegendElement; - new (): HTMLScLegendElement; + var HTMLIotAppKitVisLineChartColoredPointElement: { + prototype: HTMLIotAppKitVisLineChartColoredPointElement; + new (): HTMLIotAppKitVisLineChartColoredPointElement; }; - interface HTMLScLegendRowElement extends Components.ScLegendRow, HTMLStencilElement { + interface HTMLIotAppKitVisLineChartStreamDataElement extends Components.IotAppKitVisLineChartStreamData, HTMLStencilElement { } - var HTMLScLegendRowElement: { - prototype: HTMLScLegendRowElement; - new (): HTMLScLegendRowElement; + var HTMLIotAppKitVisLineChartStreamDataElement: { + prototype: HTMLIotAppKitVisLineChartStreamDataElement; + new (): HTMLIotAppKitVisLineChartStreamDataElement; }; - interface HTMLScLineChartElement extends Components.ScLineChart, HTMLStencilElement { + interface HTMLIotAppKitVisLoadingSpinnerElement extends Components.IotAppKitVisLoadingSpinner, HTMLStencilElement { } - var HTMLScLineChartElement: { - prototype: HTMLScLineChartElement; - new (): HTMLScLineChartElement; + var HTMLIotAppKitVisLoadingSpinnerElement: { + prototype: HTMLIotAppKitVisLoadingSpinnerElement; + new (): HTMLIotAppKitVisLoadingSpinnerElement; }; - interface HTMLScLineChartColoredPointElement extends Components.ScLineChartColoredPoint, HTMLStencilElement { + interface HTMLIotAppKitVisMultipleBarsElement extends Components.IotAppKitVisMultipleBars, HTMLStencilElement { } - var HTMLScLineChartColoredPointElement: { - prototype: HTMLScLineChartColoredPointElement; - new (): HTMLScLineChartColoredPointElement; + var HTMLIotAppKitVisMultipleBarsElement: { + prototype: HTMLIotAppKitVisMultipleBarsElement; + new (): HTMLIotAppKitVisMultipleBarsElement; }; - interface HTMLScLineChartStreamDataElement extends Components.ScLineChartStreamData, HTMLStencilElement { + interface HTMLIotAppKitVisMultipleLinesElement extends Components.IotAppKitVisMultipleLines, HTMLStencilElement { } - var HTMLScLineChartStreamDataElement: { - prototype: HTMLScLineChartStreamDataElement; - new (): HTMLScLineChartStreamDataElement; + var HTMLIotAppKitVisMultipleLinesElement: { + prototype: HTMLIotAppKitVisMultipleLinesElement; + new (): HTMLIotAppKitVisMultipleLinesElement; }; - interface HTMLScLoadingSpinnerElement extends Components.ScLoadingSpinner, HTMLStencilElement { + interface HTMLIotAppKitVisMultipleLinesOverlappingElement extends Components.IotAppKitVisMultipleLinesOverlapping, HTMLStencilElement { } - var HTMLScLoadingSpinnerElement: { - prototype: HTMLScLoadingSpinnerElement; - new (): HTMLScLoadingSpinnerElement; + var HTMLIotAppKitVisMultipleLinesOverlappingElement: { + prototype: HTMLIotAppKitVisMultipleLinesOverlappingElement; + new (): HTMLIotAppKitVisMultipleLinesOverlappingElement; }; - interface HTMLScMultipleBarsElement extends Components.ScMultipleBars, HTMLStencilElement { + interface HTMLIotAppKitVisScatterChartElement extends Components.IotAppKitVisScatterChart, HTMLStencilElement { } - var HTMLScMultipleBarsElement: { - prototype: HTMLScMultipleBarsElement; - new (): HTMLScMultipleBarsElement; + var HTMLIotAppKitVisScatterChartElement: { + prototype: HTMLIotAppKitVisScatterChartElement; + new (): HTMLIotAppKitVisScatterChartElement; }; - interface HTMLScMultipleLinesElement extends Components.ScMultipleLines, HTMLStencilElement { + interface HTMLIotAppKitVisScatterChartDynamicDataElement extends Components.IotAppKitVisScatterChartDynamicData, HTMLStencilElement { } - var HTMLScMultipleLinesElement: { - prototype: HTMLScMultipleLinesElement; - new (): HTMLScMultipleLinesElement; + var HTMLIotAppKitVisScatterChartDynamicDataElement: { + prototype: HTMLIotAppKitVisScatterChartDynamicDataElement; + new (): HTMLIotAppKitVisScatterChartDynamicDataElement; }; - interface HTMLScMultipleLinesOverlappingElement extends Components.ScMultipleLinesOverlapping, HTMLStencilElement { + interface HTMLIotAppKitVisScatterChartThresholdElement extends Components.IotAppKitVisScatterChartThreshold, HTMLStencilElement { } - var HTMLScMultipleLinesOverlappingElement: { - prototype: HTMLScMultipleLinesOverlappingElement; - new (): HTMLScMultipleLinesOverlappingElement; + var HTMLIotAppKitVisScatterChartThresholdElement: { + prototype: HTMLIotAppKitVisScatterChartThresholdElement; + new (): HTMLIotAppKitVisScatterChartThresholdElement; }; - interface HTMLScScatterChartElement extends Components.ScScatterChart, HTMLStencilElement { + interface HTMLIotAppKitVisScatterChartThresholdColorationBandElement extends Components.IotAppKitVisScatterChartThresholdColorationBand, HTMLStencilElement { } - var HTMLScScatterChartElement: { - prototype: HTMLScScatterChartElement; - new (): HTMLScScatterChartElement; + var HTMLIotAppKitVisScatterChartThresholdColorationBandElement: { + prototype: HTMLIotAppKitVisScatterChartThresholdColorationBandElement; + new (): HTMLIotAppKitVisScatterChartThresholdColorationBandElement; }; - interface HTMLScScatterChartDynamicDataElement extends Components.ScScatterChartDynamicData, HTMLStencilElement { + interface HTMLIotAppKitVisScatterChartThresholdColorationExactPointElement extends Components.IotAppKitVisScatterChartThresholdColorationExactPoint, HTMLStencilElement { } - var HTMLScScatterChartDynamicDataElement: { - prototype: HTMLScScatterChartDynamicDataElement; - new (): HTMLScScatterChartDynamicDataElement; + var HTMLIotAppKitVisScatterChartThresholdColorationExactPointElement: { + prototype: HTMLIotAppKitVisScatterChartThresholdColorationExactPointElement; + new (): HTMLIotAppKitVisScatterChartThresholdColorationExactPointElement; }; - interface HTMLScScatterChartThresholdElement extends Components.ScScatterChartThreshold, HTMLStencilElement { + interface HTMLIotAppKitVisScatterChartThresholdColorationMultipleDataStreamElement extends Components.IotAppKitVisScatterChartThresholdColorationMultipleDataStream, HTMLStencilElement { } - var HTMLScScatterChartThresholdElement: { - prototype: HTMLScScatterChartThresholdElement; - new (): HTMLScScatterChartThresholdElement; + var HTMLIotAppKitVisScatterChartThresholdColorationMultipleDataStreamElement: { + prototype: HTMLIotAppKitVisScatterChartThresholdColorationMultipleDataStreamElement; + new (): HTMLIotAppKitVisScatterChartThresholdColorationMultipleDataStreamElement; }; - interface HTMLScScatterChartThresholdColorationBandElement extends Components.ScScatterChartThresholdColorationBand, HTMLStencilElement { + interface HTMLIotAppKitVisScatterChartThresholdColorationMultipleThresholdsElement extends Components.IotAppKitVisScatterChartThresholdColorationMultipleThresholds, HTMLStencilElement { } - var HTMLScScatterChartThresholdColorationBandElement: { - prototype: HTMLScScatterChartThresholdColorationBandElement; - new (): HTMLScScatterChartThresholdColorationBandElement; + var HTMLIotAppKitVisScatterChartThresholdColorationMultipleThresholdsElement: { + prototype: HTMLIotAppKitVisScatterChartThresholdColorationMultipleThresholdsElement; + new (): HTMLIotAppKitVisScatterChartThresholdColorationMultipleThresholdsElement; }; - interface HTMLScScatterChartThresholdColorationExactPointElement extends Components.ScScatterChartThresholdColorationExactPoint, HTMLStencilElement { + interface HTMLIotAppKitVisScatterChartThresholdNoColorationElement extends Components.IotAppKitVisScatterChartThresholdNoColoration, HTMLStencilElement { } - var HTMLScScatterChartThresholdColorationExactPointElement: { - prototype: HTMLScScatterChartThresholdColorationExactPointElement; - new (): HTMLScScatterChartThresholdColorationExactPointElement; + var HTMLIotAppKitVisScatterChartThresholdNoColorationElement: { + prototype: HTMLIotAppKitVisScatterChartThresholdNoColorationElement; + new (): HTMLIotAppKitVisScatterChartThresholdNoColorationElement; }; - interface HTMLScScatterChartThresholdColorationMultipleDataStreamElement extends Components.ScScatterChartThresholdColorationMultipleDataStream, HTMLStencilElement { + interface HTMLIotAppKitVisScatterChartTooltipWithMultipleDataStreamsAndTrendsElement extends Components.IotAppKitVisScatterChartTooltipWithMultipleDataStreamsAndTrends, HTMLStencilElement { } - var HTMLScScatterChartThresholdColorationMultipleDataStreamElement: { - prototype: HTMLScScatterChartThresholdColorationMultipleDataStreamElement; - new (): HTMLScScatterChartThresholdColorationMultipleDataStreamElement; + var HTMLIotAppKitVisScatterChartTooltipWithMultipleDataStreamsAndTrendsElement: { + prototype: HTMLIotAppKitVisScatterChartTooltipWithMultipleDataStreamsAndTrendsElement; + new (): HTMLIotAppKitVisScatterChartTooltipWithMultipleDataStreamsAndTrendsElement; }; - interface HTMLScScatterChartThresholdColorationMultipleThresholdsElement extends Components.ScScatterChartThresholdColorationMultipleThresholds, HTMLStencilElement { + interface HTMLIotAppKitVisScatterChartTrendLineColorConfigurationElement extends Components.IotAppKitVisScatterChartTrendLineColorConfiguration, HTMLStencilElement { } - var HTMLScScatterChartThresholdColorationMultipleThresholdsElement: { - prototype: HTMLScScatterChartThresholdColorationMultipleThresholdsElement; - new (): HTMLScScatterChartThresholdColorationMultipleThresholdsElement; + var HTMLIotAppKitVisScatterChartTrendLineColorConfigurationElement: { + prototype: HTMLIotAppKitVisScatterChartTrendLineColorConfigurationElement; + new (): HTMLIotAppKitVisScatterChartTrendLineColorConfigurationElement; }; - interface HTMLScScatterChartThresholdNoColorationElement extends Components.ScScatterChartThresholdNoColoration, HTMLStencilElement { + interface HTMLIotAppKitVisScatterChartTrendLineWithLegendElement extends Components.IotAppKitVisScatterChartTrendLineWithLegend, HTMLStencilElement { } - var HTMLScScatterChartThresholdNoColorationElement: { - prototype: HTMLScScatterChartThresholdNoColorationElement; - new (): HTMLScScatterChartThresholdNoColorationElement; + var HTMLIotAppKitVisScatterChartTrendLineWithLegendElement: { + prototype: HTMLIotAppKitVisScatterChartTrendLineWithLegendElement; + new (): HTMLIotAppKitVisScatterChartTrendLineWithLegendElement; }; - interface HTMLScScatterChartTooltipWithMultipleDataStreamsAndTrendsElement extends Components.ScScatterChartTooltipWithMultipleDataStreamsAndTrends, HTMLStencilElement { + interface HTMLIotAppKitVisScatterChartUnsupportedDataTypesElement extends Components.IotAppKitVisScatterChartUnsupportedDataTypes, HTMLStencilElement { } - var HTMLScScatterChartTooltipWithMultipleDataStreamsAndTrendsElement: { - prototype: HTMLScScatterChartTooltipWithMultipleDataStreamsAndTrendsElement; - new (): HTMLScScatterChartTooltipWithMultipleDataStreamsAndTrendsElement; + var HTMLIotAppKitVisScatterChartUnsupportedDataTypesElement: { + prototype: HTMLIotAppKitVisScatterChartUnsupportedDataTypesElement; + new (): HTMLIotAppKitVisScatterChartUnsupportedDataTypesElement; }; - interface HTMLScScatterChartTrendLineColorConfigurationElement extends Components.ScScatterChartTrendLineColorConfiguration, HTMLStencilElement { + interface HTMLIotAppKitVisSingleBarElement extends Components.IotAppKitVisSingleBar, HTMLStencilElement { } - var HTMLScScatterChartTrendLineColorConfigurationElement: { - prototype: HTMLScScatterChartTrendLineColorConfigurationElement; - new (): HTMLScScatterChartTrendLineColorConfigurationElement; + var HTMLIotAppKitVisSingleBarElement: { + prototype: HTMLIotAppKitVisSingleBarElement; + new (): HTMLIotAppKitVisSingleBarElement; }; - interface HTMLScScatterChartTrendLineWithLegendElement extends Components.ScScatterChartTrendLineWithLegend, HTMLStencilElement { + interface HTMLIotAppKitVisSingleColoredBarElement extends Components.IotAppKitVisSingleColoredBar, HTMLStencilElement { } - var HTMLScScatterChartTrendLineWithLegendElement: { - prototype: HTMLScScatterChartTrendLineWithLegendElement; - new (): HTMLScScatterChartTrendLineWithLegendElement; + var HTMLIotAppKitVisSingleColoredBarElement: { + prototype: HTMLIotAppKitVisSingleColoredBarElement; + new (): HTMLIotAppKitVisSingleColoredBarElement; }; - interface HTMLScScatterChartUnsupportedDataTypesElement extends Components.ScScatterChartUnsupportedDataTypes, HTMLStencilElement { + interface HTMLIotAppKitVisSizeProviderElement extends Components.IotAppKitVisSizeProvider, HTMLStencilElement { } - var HTMLScScatterChartUnsupportedDataTypesElement: { - prototype: HTMLScScatterChartUnsupportedDataTypesElement; - new (): HTMLScScatterChartUnsupportedDataTypesElement; + var HTMLIotAppKitVisSizeProviderElement: { + prototype: HTMLIotAppKitVisSizeProviderElement; + new (): HTMLIotAppKitVisSizeProviderElement; }; - interface HTMLScSingleBarElement extends Components.ScSingleBar, HTMLStencilElement { + interface HTMLIotAppKitVisSizeProviderStandardElement extends Components.IotAppKitVisSizeProviderStandard, HTMLStencilElement { } - var HTMLScSingleBarElement: { - prototype: HTMLScSingleBarElement; - new (): HTMLScSingleBarElement; + var HTMLIotAppKitVisSizeProviderStandardElement: { + prototype: HTMLIotAppKitVisSizeProviderStandardElement; + new (): HTMLIotAppKitVisSizeProviderStandardElement; }; - interface HTMLScSingleColoredBarElement extends Components.ScSingleColoredBar, HTMLStencilElement { + interface HTMLIotAppKitVisStatusTimelineElement extends Components.IotAppKitVisStatusTimeline, HTMLStencilElement { } - var HTMLScSingleColoredBarElement: { - prototype: HTMLScSingleColoredBarElement; - new (): HTMLScSingleColoredBarElement; + var HTMLIotAppKitVisStatusTimelineElement: { + prototype: HTMLIotAppKitVisStatusTimelineElement; + new (): HTMLIotAppKitVisStatusTimelineElement; }; - interface HTMLScSizeProviderElement extends Components.ScSizeProvider, HTMLStencilElement { + interface HTMLIotAppKitVisStatusTimelineOverlayElement extends Components.IotAppKitVisStatusTimelineOverlay, HTMLStencilElement { } - var HTMLScSizeProviderElement: { - prototype: HTMLScSizeProviderElement; - new (): HTMLScSizeProviderElement; + var HTMLIotAppKitVisStatusTimelineOverlayElement: { + prototype: HTMLIotAppKitVisStatusTimelineOverlayElement; + new (): HTMLIotAppKitVisStatusTimelineOverlayElement; }; - interface HTMLScSizeProviderStandardElement extends Components.ScSizeProviderStandard, HTMLStencilElement { + interface HTMLIotAppKitVisStatusTimelineOverlayRowElement extends Components.IotAppKitVisStatusTimelineOverlayRow, HTMLStencilElement { } - var HTMLScSizeProviderStandardElement: { - prototype: HTMLScSizeProviderStandardElement; - new (): HTMLScSizeProviderStandardElement; + var HTMLIotAppKitVisStatusTimelineOverlayRowElement: { + prototype: HTMLIotAppKitVisStatusTimelineOverlayRowElement; + new (): HTMLIotAppKitVisStatusTimelineOverlayRowElement; }; - interface HTMLScStatusTimelineElement extends Components.ScStatusTimeline, HTMLStencilElement { + interface HTMLIotAppKitVisStraightLineSegmentElement extends Components.IotAppKitVisStraightLineSegment, HTMLStencilElement { } - var HTMLScStatusTimelineElement: { - prototype: HTMLScStatusTimelineElement; - new (): HTMLScStatusTimelineElement; + var HTMLIotAppKitVisStraightLineSegmentElement: { + prototype: HTMLIotAppKitVisStraightLineSegmentElement; + new (): HTMLIotAppKitVisStraightLineSegmentElement; }; - interface HTMLScStatusTimelineOverlayElement extends Components.ScStatusTimelineOverlay, HTMLStencilElement { + interface HTMLIotAppKitVisStraightLineSegmentColoredElement extends Components.IotAppKitVisStraightLineSegmentColored, HTMLStencilElement { } - var HTMLScStatusTimelineOverlayElement: { - prototype: HTMLScStatusTimelineOverlayElement; - new (): HTMLScStatusTimelineOverlayElement; + var HTMLIotAppKitVisStraightLineSegmentColoredElement: { + prototype: HTMLIotAppKitVisStraightLineSegmentColoredElement; + new (): HTMLIotAppKitVisStraightLineSegmentColoredElement; }; - interface HTMLScStatusTimelineOverlayRowElement extends Components.ScStatusTimelineOverlayRow, HTMLStencilElement { + interface HTMLIotAppKitVisThresholdLegendElement extends Components.IotAppKitVisThresholdLegend, HTMLStencilElement { } - var HTMLScStatusTimelineOverlayRowElement: { - prototype: HTMLScStatusTimelineOverlayRowElement; - new (): HTMLScStatusTimelineOverlayRowElement; + var HTMLIotAppKitVisThresholdLegendElement: { + prototype: HTMLIotAppKitVisThresholdLegendElement; + new (): HTMLIotAppKitVisThresholdLegendElement; }; - interface HTMLScStraightLineSegmentElement extends Components.ScStraightLineSegment, HTMLStencilElement { + interface HTMLIotAppKitVisThresholdLegendRowElement extends Components.IotAppKitVisThresholdLegendRow, HTMLStencilElement { } - var HTMLScStraightLineSegmentElement: { - prototype: HTMLScStraightLineSegmentElement; - new (): HTMLScStraightLineSegmentElement; + var HTMLIotAppKitVisThresholdLegendRowElement: { + prototype: HTMLIotAppKitVisThresholdLegendRowElement; + new (): HTMLIotAppKitVisThresholdLegendRowElement; }; - interface HTMLScStraightLineSegmentColoredElement extends Components.ScStraightLineSegmentColored, HTMLStencilElement { + interface HTMLIotAppKitVisTooltipElement extends Components.IotAppKitVisTooltip, HTMLStencilElement { } - var HTMLScStraightLineSegmentColoredElement: { - prototype: HTMLScStraightLineSegmentColoredElement; - new (): HTMLScStraightLineSegmentColoredElement; + var HTMLIotAppKitVisTooltipElement: { + prototype: HTMLIotAppKitVisTooltipElement; + new (): HTMLIotAppKitVisTooltipElement; }; - interface HTMLScThresholdLegendElement extends Components.ScThresholdLegend, HTMLStencilElement { + interface HTMLIotAppKitVisTooltipRowElement extends Components.IotAppKitVisTooltipRow, HTMLStencilElement { } - var HTMLScThresholdLegendElement: { - prototype: HTMLScThresholdLegendElement; - new (): HTMLScThresholdLegendElement; + var HTMLIotAppKitVisTooltipRowElement: { + prototype: HTMLIotAppKitVisTooltipRowElement; + new (): HTMLIotAppKitVisTooltipRowElement; }; - interface HTMLScThresholdLegendRowElement extends Components.ScThresholdLegendRow, HTMLStencilElement { + interface HTMLIotAppKitVisTooltipRowsElement extends Components.IotAppKitVisTooltipRows, HTMLStencilElement { } - var HTMLScThresholdLegendRowElement: { - prototype: HTMLScThresholdLegendRowElement; - new (): HTMLScThresholdLegendRowElement; + var HTMLIotAppKitVisTooltipRowsElement: { + prototype: HTMLIotAppKitVisTooltipRowsElement; + new (): HTMLIotAppKitVisTooltipRowsElement; }; - interface HTMLScTooltipElement extends Components.ScTooltip, HTMLStencilElement { + interface HTMLIotAppKitVisWebglAxisElement extends Components.IotAppKitVisWebglAxis, HTMLStencilElement { } - var HTMLScTooltipElement: { - prototype: HTMLScTooltipElement; - new (): HTMLScTooltipElement; + var HTMLIotAppKitVisWebglAxisElement: { + prototype: HTMLIotAppKitVisWebglAxisElement; + new (): HTMLIotAppKitVisWebglAxisElement; }; - interface HTMLScTooltipRowElement extends Components.ScTooltipRow, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBarChartDynamicBufferElement extends Components.IotAppKitVisWebglBarChartDynamicBuffer, HTMLStencilElement { } - var HTMLScTooltipRowElement: { - prototype: HTMLScTooltipRowElement; - new (): HTMLScTooltipRowElement; + var HTMLIotAppKitVisWebglBarChartDynamicBufferElement: { + prototype: HTMLIotAppKitVisWebglBarChartDynamicBufferElement; + new (): HTMLIotAppKitVisWebglBarChartDynamicBufferElement; }; - interface HTMLScTooltipRowsElement extends Components.ScTooltipRows, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBarChartDynamicDataElement extends Components.IotAppKitVisWebglBarChartDynamicData, HTMLStencilElement { } - var HTMLScTooltipRowsElement: { - prototype: HTMLScTooltipRowsElement; - new (): HTMLScTooltipRowsElement; + var HTMLIotAppKitVisWebglBarChartDynamicDataElement: { + prototype: HTMLIotAppKitVisWebglBarChartDynamicDataElement; + new (): HTMLIotAppKitVisWebglBarChartDynamicDataElement; }; - interface HTMLScWebglAxisElement extends Components.ScWebglAxis, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBarChartDynamicDataStreamsElement extends Components.IotAppKitVisWebglBarChartDynamicDataStreams, HTMLStencilElement { } - var HTMLScWebglAxisElement: { - prototype: HTMLScWebglAxisElement; - new (): HTMLScWebglAxisElement; + var HTMLIotAppKitVisWebglBarChartDynamicDataStreamsElement: { + prototype: HTMLIotAppKitVisWebglBarChartDynamicDataStreamsElement; + new (): HTMLIotAppKitVisWebglBarChartDynamicDataStreamsElement; }; - interface HTMLScWebglBarChartDynamicBufferElement extends Components.ScWebglBarChartDynamicBuffer, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBarChartFastViewportElement extends Components.IotAppKitVisWebglBarChartFastViewport, HTMLStencilElement { } - var HTMLScWebglBarChartDynamicBufferElement: { - prototype: HTMLScWebglBarChartDynamicBufferElement; - new (): HTMLScWebglBarChartDynamicBufferElement; + var HTMLIotAppKitVisWebglBarChartFastViewportElement: { + prototype: HTMLIotAppKitVisWebglBarChartFastViewportElement; + new (): HTMLIotAppKitVisWebglBarChartFastViewportElement; }; - interface HTMLScWebglBarChartDynamicDataElement extends Components.ScWebglBarChartDynamicData, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBarChartMarginElement extends Components.IotAppKitVisWebglBarChartMargin, HTMLStencilElement { } - var HTMLScWebglBarChartDynamicDataElement: { - prototype: HTMLScWebglBarChartDynamicDataElement; - new (): HTMLScWebglBarChartDynamicDataElement; + var HTMLIotAppKitVisWebglBarChartMarginElement: { + prototype: HTMLIotAppKitVisWebglBarChartMarginElement; + new (): HTMLIotAppKitVisWebglBarChartMarginElement; }; - interface HTMLScWebglBarChartDynamicDataStreamsElement extends Components.ScWebglBarChartDynamicDataStreams, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBarChartNegativeElement extends Components.IotAppKitVisWebglBarChartNegative, HTMLStencilElement { } - var HTMLScWebglBarChartDynamicDataStreamsElement: { - prototype: HTMLScWebglBarChartDynamicDataStreamsElement; - new (): HTMLScWebglBarChartDynamicDataStreamsElement; + var HTMLIotAppKitVisWebglBarChartNegativeElement: { + prototype: HTMLIotAppKitVisWebglBarChartNegativeElement; + new (): HTMLIotAppKitVisWebglBarChartNegativeElement; }; - interface HTMLScWebglBarChartFastViewportElement extends Components.ScWebglBarChartFastViewport, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBarChartPositiveNegativeElement extends Components.IotAppKitVisWebglBarChartPositiveNegative, HTMLStencilElement { } - var HTMLScWebglBarChartFastViewportElement: { - prototype: HTMLScWebglBarChartFastViewportElement; - new (): HTMLScWebglBarChartFastViewportElement; + var HTMLIotAppKitVisWebglBarChartPositiveNegativeElement: { + prototype: HTMLIotAppKitVisWebglBarChartPositiveNegativeElement; + new (): HTMLIotAppKitVisWebglBarChartPositiveNegativeElement; }; - interface HTMLScWebglBarChartMarginElement extends Components.ScWebglBarChartMargin, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBarChartStandardElement extends Components.IotAppKitVisWebglBarChartStandard, HTMLStencilElement { } - var HTMLScWebglBarChartMarginElement: { - prototype: HTMLScWebglBarChartMarginElement; - new (): HTMLScWebglBarChartMarginElement; + var HTMLIotAppKitVisWebglBarChartStandardElement: { + prototype: HTMLIotAppKitVisWebglBarChartStandardElement; + new (): HTMLIotAppKitVisWebglBarChartStandardElement; }; - interface HTMLScWebglBarChartNegativeElement extends Components.ScWebglBarChartNegative, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBarChartStartFromZeroElement extends Components.IotAppKitVisWebglBarChartStartFromZero, HTMLStencilElement { } - var HTMLScWebglBarChartNegativeElement: { - prototype: HTMLScWebglBarChartNegativeElement; - new (): HTMLScWebglBarChartNegativeElement; + var HTMLIotAppKitVisWebglBarChartStartFromZeroElement: { + prototype: HTMLIotAppKitVisWebglBarChartStartFromZeroElement; + new (): HTMLIotAppKitVisWebglBarChartStartFromZeroElement; }; - interface HTMLScWebglBarChartPositiveNegativeElement extends Components.ScWebglBarChartPositiveNegative, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBarChartThresholdColorationElement extends Components.IotAppKitVisWebglBarChartThresholdColoration, HTMLStencilElement { } - var HTMLScWebglBarChartPositiveNegativeElement: { - prototype: HTMLScWebglBarChartPositiveNegativeElement; - new (): HTMLScWebglBarChartPositiveNegativeElement; + var HTMLIotAppKitVisWebglBarChartThresholdColorationElement: { + prototype: HTMLIotAppKitVisWebglBarChartThresholdColorationElement; + new (): HTMLIotAppKitVisWebglBarChartThresholdColorationElement; }; - interface HTMLScWebglBarChartStandardElement extends Components.ScWebglBarChartStandard, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBarChartThresholdColorationBandElement extends Components.IotAppKitVisWebglBarChartThresholdColorationBand, HTMLStencilElement { } - var HTMLScWebglBarChartStandardElement: { - prototype: HTMLScWebglBarChartStandardElement; - new (): HTMLScWebglBarChartStandardElement; + var HTMLIotAppKitVisWebglBarChartThresholdColorationBandElement: { + prototype: HTMLIotAppKitVisWebglBarChartThresholdColorationBandElement; + new (): HTMLIotAppKitVisWebglBarChartThresholdColorationBandElement; }; - interface HTMLScWebglBarChartStartFromZeroElement extends Components.ScWebglBarChartStartFromZero, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBarChartThresholdColorationExactPointElement extends Components.IotAppKitVisWebglBarChartThresholdColorationExactPoint, HTMLStencilElement { } - var HTMLScWebglBarChartStartFromZeroElement: { - prototype: HTMLScWebglBarChartStartFromZeroElement; - new (): HTMLScWebglBarChartStartFromZeroElement; + var HTMLIotAppKitVisWebglBarChartThresholdColorationExactPointElement: { + prototype: HTMLIotAppKitVisWebglBarChartThresholdColorationExactPointElement; + new (): HTMLIotAppKitVisWebglBarChartThresholdColorationExactPointElement; }; - interface HTMLScWebglBarChartThresholdColorationElement extends Components.ScWebglBarChartThresholdColoration, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBarChartThresholdColorationMultipleDataStreamElement extends Components.IotAppKitVisWebglBarChartThresholdColorationMultipleDataStream, HTMLStencilElement { } - var HTMLScWebglBarChartThresholdColorationElement: { - prototype: HTMLScWebglBarChartThresholdColorationElement; - new (): HTMLScWebglBarChartThresholdColorationElement; + var HTMLIotAppKitVisWebglBarChartThresholdColorationMultipleDataStreamElement: { + prototype: HTMLIotAppKitVisWebglBarChartThresholdColorationMultipleDataStreamElement; + new (): HTMLIotAppKitVisWebglBarChartThresholdColorationMultipleDataStreamElement; }; - interface HTMLScWebglBarChartThresholdColorationBandElement extends Components.ScWebglBarChartThresholdColorationBand, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBarChartThresholdColorationMultipleThresholdsElement extends Components.IotAppKitVisWebglBarChartThresholdColorationMultipleThresholds, HTMLStencilElement { } - var HTMLScWebglBarChartThresholdColorationBandElement: { - prototype: HTMLScWebglBarChartThresholdColorationBandElement; - new (): HTMLScWebglBarChartThresholdColorationBandElement; + var HTMLIotAppKitVisWebglBarChartThresholdColorationMultipleThresholdsElement: { + prototype: HTMLIotAppKitVisWebglBarChartThresholdColorationMultipleThresholdsElement; + new (): HTMLIotAppKitVisWebglBarChartThresholdColorationMultipleThresholdsElement; }; - interface HTMLScWebglBarChartThresholdColorationExactPointElement extends Components.ScWebglBarChartThresholdColorationExactPoint, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBarChartThresholdNoColorationElement extends Components.IotAppKitVisWebglBarChartThresholdNoColoration, HTMLStencilElement { } - var HTMLScWebglBarChartThresholdColorationExactPointElement: { - prototype: HTMLScWebglBarChartThresholdColorationExactPointElement; - new (): HTMLScWebglBarChartThresholdColorationExactPointElement; + var HTMLIotAppKitVisWebglBarChartThresholdNoColorationElement: { + prototype: HTMLIotAppKitVisWebglBarChartThresholdNoColorationElement; + new (): HTMLIotAppKitVisWebglBarChartThresholdNoColorationElement; }; - interface HTMLScWebglBarChartThresholdColorationMultipleDataStreamElement extends Components.ScWebglBarChartThresholdColorationMultipleDataStream, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBarChartUnsupportedDataTypesElement extends Components.IotAppKitVisWebglBarChartUnsupportedDataTypes, HTMLStencilElement { } - var HTMLScWebglBarChartThresholdColorationMultipleDataStreamElement: { - prototype: HTMLScWebglBarChartThresholdColorationMultipleDataStreamElement; - new (): HTMLScWebglBarChartThresholdColorationMultipleDataStreamElement; + var HTMLIotAppKitVisWebglBarChartUnsupportedDataTypesElement: { + prototype: HTMLIotAppKitVisWebglBarChartUnsupportedDataTypesElement; + new (): HTMLIotAppKitVisWebglBarChartUnsupportedDataTypesElement; }; - interface HTMLScWebglBarChartThresholdColorationMultipleThresholdsElement extends Components.ScWebglBarChartThresholdColorationMultipleThresholds, HTMLStencilElement { + interface HTMLIotAppKitVisWebglBaseChartElement extends Components.IotAppKitVisWebglBaseChart, HTMLStencilElement { } - var HTMLScWebglBarChartThresholdColorationMultipleThresholdsElement: { - prototype: HTMLScWebglBarChartThresholdColorationMultipleThresholdsElement; - new (): HTMLScWebglBarChartThresholdColorationMultipleThresholdsElement; + var HTMLIotAppKitVisWebglBaseChartElement: { + prototype: HTMLIotAppKitVisWebglBaseChartElement; + new (): HTMLIotAppKitVisWebglBaseChartElement; }; - interface HTMLScWebglBarChartThresholdNoColorationElement extends Components.ScWebglBarChartThresholdNoColoration, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartAnnotationEditableElement extends Components.IotAppKitVisWebglChartAnnotationEditable, HTMLStencilElement { } - var HTMLScWebglBarChartThresholdNoColorationElement: { - prototype: HTMLScWebglBarChartThresholdNoColorationElement; - new (): HTMLScWebglBarChartThresholdNoColorationElement; + var HTMLIotAppKitVisWebglChartAnnotationEditableElement: { + prototype: HTMLIotAppKitVisWebglChartAnnotationEditableElement; + new (): HTMLIotAppKitVisWebglChartAnnotationEditableElement; }; - interface HTMLScWebglBarChartUnsupportedDataTypesElement extends Components.ScWebglBarChartUnsupportedDataTypes, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartAnnotationsElement extends Components.IotAppKitVisWebglChartAnnotations, HTMLStencilElement { } - var HTMLScWebglBarChartUnsupportedDataTypesElement: { - prototype: HTMLScWebglBarChartUnsupportedDataTypesElement; - new (): HTMLScWebglBarChartUnsupportedDataTypesElement; + var HTMLIotAppKitVisWebglChartAnnotationsElement: { + prototype: HTMLIotAppKitVisWebglChartAnnotationsElement; + new (): HTMLIotAppKitVisWebglChartAnnotationsElement; }; - interface HTMLScWebglBaseChartElement extends Components.ScWebglBaseChart, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartAnnotationsAlwaysInViewportElement extends Components.IotAppKitVisWebglChartAnnotationsAlwaysInViewport, HTMLStencilElement { } - var HTMLScWebglBaseChartElement: { - prototype: HTMLScWebglBaseChartElement; - new (): HTMLScWebglBaseChartElement; + var HTMLIotAppKitVisWebglChartAnnotationsAlwaysInViewportElement: { + prototype: HTMLIotAppKitVisWebglChartAnnotationsAlwaysInViewportElement; + new (): HTMLIotAppKitVisWebglChartAnnotationsAlwaysInViewportElement; }; - interface HTMLScWebglChartAnnotationEditableElement extends Components.ScWebglChartAnnotationEditable, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartAxisElement extends Components.IotAppKitVisWebglChartAxis, HTMLStencilElement { } - var HTMLScWebglChartAnnotationEditableElement: { - prototype: HTMLScWebglChartAnnotationEditableElement; - new (): HTMLScWebglChartAnnotationEditableElement; + var HTMLIotAppKitVisWebglChartAxisElement: { + prototype: HTMLIotAppKitVisWebglChartAxisElement; + new (): HTMLIotAppKitVisWebglChartAxisElement; }; - interface HTMLScWebglChartAnnotationsElement extends Components.ScWebglChartAnnotations, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartDynamicChartsElement extends Components.IotAppKitVisWebglChartDynamicCharts, HTMLStencilElement { } - var HTMLScWebglChartAnnotationsElement: { - prototype: HTMLScWebglChartAnnotationsElement; - new (): HTMLScWebglChartAnnotationsElement; + var HTMLIotAppKitVisWebglChartDynamicChartsElement: { + prototype: HTMLIotAppKitVisWebglChartDynamicChartsElement; + new (): HTMLIotAppKitVisWebglChartDynamicChartsElement; }; - interface HTMLScWebglChartAnnotationsAlwaysInViewportElement extends Components.ScWebglChartAnnotationsAlwaysInViewport, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartLargeViewportElement extends Components.IotAppKitVisWebglChartLargeViewport, HTMLStencilElement { } - var HTMLScWebglChartAnnotationsAlwaysInViewportElement: { - prototype: HTMLScWebglChartAnnotationsAlwaysInViewportElement; - new (): HTMLScWebglChartAnnotationsAlwaysInViewportElement; + var HTMLIotAppKitVisWebglChartLargeViewportElement: { + prototype: HTMLIotAppKitVisWebglChartLargeViewportElement; + new (): HTMLIotAppKitVisWebglChartLargeViewportElement; }; - interface HTMLScWebglChartAxisElement extends Components.ScWebglChartAxis, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartMultiElement extends Components.IotAppKitVisWebglChartMulti, HTMLStencilElement { } - var HTMLScWebglChartAxisElement: { - prototype: HTMLScWebglChartAxisElement; - new (): HTMLScWebglChartAxisElement; + var HTMLIotAppKitVisWebglChartMultiElement: { + prototype: HTMLIotAppKitVisWebglChartMultiElement; + new (): HTMLIotAppKitVisWebglChartMultiElement; }; - interface HTMLScWebglChartDynamicChartsElement extends Components.ScWebglChartDynamicCharts, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartNoAnnotationsElement extends Components.IotAppKitVisWebglChartNoAnnotations, HTMLStencilElement { } - var HTMLScWebglChartDynamicChartsElement: { - prototype: HTMLScWebglChartDynamicChartsElement; - new (): HTMLScWebglChartDynamicChartsElement; + var HTMLIotAppKitVisWebglChartNoAnnotationsElement: { + prototype: HTMLIotAppKitVisWebglChartNoAnnotationsElement; + new (): HTMLIotAppKitVisWebglChartNoAnnotationsElement; }; - interface HTMLScWebglChartLargeViewportElement extends Components.ScWebglChartLargeViewport, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartStandardElement extends Components.IotAppKitVisWebglChartStandard, HTMLStencilElement { } - var HTMLScWebglChartLargeViewportElement: { - prototype: HTMLScWebglChartLargeViewportElement; - new (): HTMLScWebglChartLargeViewportElement; + var HTMLIotAppKitVisWebglChartStandardElement: { + prototype: HTMLIotAppKitVisWebglChartStandardElement; + new (): HTMLIotAppKitVisWebglChartStandardElement; }; - interface HTMLScWebglChartMultiElement extends Components.ScWebglChartMulti, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartStandardWithLegendElement extends Components.IotAppKitVisWebglChartStandardWithLegend, HTMLStencilElement { } - var HTMLScWebglChartMultiElement: { - prototype: HTMLScWebglChartMultiElement; - new (): HTMLScWebglChartMultiElement; + var HTMLIotAppKitVisWebglChartStandardWithLegendElement: { + prototype: HTMLIotAppKitVisWebglChartStandardWithLegendElement; + new (): HTMLIotAppKitVisWebglChartStandardWithLegendElement; }; - interface HTMLScWebglChartNoAnnotationsElement extends Components.ScWebglChartNoAnnotations, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartStandardWithLegendOnRightElement extends Components.IotAppKitVisWebglChartStandardWithLegendOnRight, HTMLStencilElement { } - var HTMLScWebglChartNoAnnotationsElement: { - prototype: HTMLScWebglChartNoAnnotationsElement; - new (): HTMLScWebglChartNoAnnotationsElement; + var HTMLIotAppKitVisWebglChartStandardWithLegendOnRightElement: { + prototype: HTMLIotAppKitVisWebglChartStandardWithLegendOnRightElement; + new (): HTMLIotAppKitVisWebglChartStandardWithLegendOnRightElement; }; - interface HTMLScWebglChartStandardElement extends Components.ScWebglChartStandard, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartThresholdColorationBandElement extends Components.IotAppKitVisWebglChartThresholdColorationBand, HTMLStencilElement { } - var HTMLScWebglChartStandardElement: { - prototype: HTMLScWebglChartStandardElement; - new (): HTMLScWebglChartStandardElement; + var HTMLIotAppKitVisWebglChartThresholdColorationBandElement: { + prototype: HTMLIotAppKitVisWebglChartThresholdColorationBandElement; + new (): HTMLIotAppKitVisWebglChartThresholdColorationBandElement; }; - interface HTMLScWebglChartStandardWithLegendElement extends Components.ScWebglChartStandardWithLegend, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartThresholdColorationExactPointElement extends Components.IotAppKitVisWebglChartThresholdColorationExactPoint, HTMLStencilElement { } - var HTMLScWebglChartStandardWithLegendElement: { - prototype: HTMLScWebglChartStandardWithLegendElement; - new (): HTMLScWebglChartStandardWithLegendElement; + var HTMLIotAppKitVisWebglChartThresholdColorationExactPointElement: { + prototype: HTMLIotAppKitVisWebglChartThresholdColorationExactPointElement; + new (): HTMLIotAppKitVisWebglChartThresholdColorationExactPointElement; }; - interface HTMLScWebglChartStandardWithLegendOnRightElement extends Components.ScWebglChartStandardWithLegendOnRight, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartThresholdColorationMultipleDataStreamElement extends Components.IotAppKitVisWebglChartThresholdColorationMultipleDataStream, HTMLStencilElement { } - var HTMLScWebglChartStandardWithLegendOnRightElement: { - prototype: HTMLScWebglChartStandardWithLegendOnRightElement; - new (): HTMLScWebglChartStandardWithLegendOnRightElement; + var HTMLIotAppKitVisWebglChartThresholdColorationMultipleDataStreamElement: { + prototype: HTMLIotAppKitVisWebglChartThresholdColorationMultipleDataStreamElement; + new (): HTMLIotAppKitVisWebglChartThresholdColorationMultipleDataStreamElement; }; - interface HTMLScWebglChartThresholdColorationBandElement extends Components.ScWebglChartThresholdColorationBand, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartThresholdColorationMultipleThresholdsElement extends Components.IotAppKitVisWebglChartThresholdColorationMultipleThresholds, HTMLStencilElement { } - var HTMLScWebglChartThresholdColorationBandElement: { - prototype: HTMLScWebglChartThresholdColorationBandElement; - new (): HTMLScWebglChartThresholdColorationBandElement; + var HTMLIotAppKitVisWebglChartThresholdColorationMultipleThresholdsElement: { + prototype: HTMLIotAppKitVisWebglChartThresholdColorationMultipleThresholdsElement; + new (): HTMLIotAppKitVisWebglChartThresholdColorationMultipleThresholdsElement; }; - interface HTMLScWebglChartThresholdColorationExactPointElement extends Components.ScWebglChartThresholdColorationExactPoint, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartThresholdColorationSplitHalfElement extends Components.IotAppKitVisWebglChartThresholdColorationSplitHalf, HTMLStencilElement { } - var HTMLScWebglChartThresholdColorationExactPointElement: { - prototype: HTMLScWebglChartThresholdColorationExactPointElement; - new (): HTMLScWebglChartThresholdColorationExactPointElement; + var HTMLIotAppKitVisWebglChartThresholdColorationSplitHalfElement: { + prototype: HTMLIotAppKitVisWebglChartThresholdColorationSplitHalfElement; + new (): HTMLIotAppKitVisWebglChartThresholdColorationSplitHalfElement; }; - interface HTMLScWebglChartThresholdColorationMultipleDataStreamElement extends Components.ScWebglChartThresholdColorationMultipleDataStream, HTMLStencilElement { + interface HTMLIotAppKitVisWebglChartTooltipWithMultipleDataStreamsElement extends Components.IotAppKitVisWebglChartTooltipWithMultipleDataStreams, HTMLStencilElement { } - var HTMLScWebglChartThresholdColorationMultipleDataStreamElement: { - prototype: HTMLScWebglChartThresholdColorationMultipleDataStreamElement; - new (): HTMLScWebglChartThresholdColorationMultipleDataStreamElement; + var HTMLIotAppKitVisWebglChartTooltipWithMultipleDataStreamsElement: { + prototype: HTMLIotAppKitVisWebglChartTooltipWithMultipleDataStreamsElement; + new (): HTMLIotAppKitVisWebglChartTooltipWithMultipleDataStreamsElement; }; - interface HTMLScWebglChartThresholdColorationMultipleThresholdsElement extends Components.ScWebglChartThresholdColorationMultipleThresholds, HTMLStencilElement { + interface HTMLIotAppKitVisWebglContextElement extends Components.IotAppKitVisWebglContext, HTMLStencilElement { } - var HTMLScWebglChartThresholdColorationMultipleThresholdsElement: { - prototype: HTMLScWebglChartThresholdColorationMultipleThresholdsElement; - new (): HTMLScWebglChartThresholdColorationMultipleThresholdsElement; + var HTMLIotAppKitVisWebglContextElement: { + prototype: HTMLIotAppKitVisWebglContextElement; + new (): HTMLIotAppKitVisWebglContextElement; }; - interface HTMLScWebglChartThresholdColorationSplitHalfElement extends Components.ScWebglChartThresholdColorationSplitHalf, HTMLStencilElement { + interface HTMLIotAppKitVisWebglContextNestedElement extends Components.IotAppKitVisWebglContextNested, HTMLStencilElement { } - var HTMLScWebglChartThresholdColorationSplitHalfElement: { - prototype: HTMLScWebglChartThresholdColorationSplitHalfElement; - new (): HTMLScWebglChartThresholdColorationSplitHalfElement; + var HTMLIotAppKitVisWebglContextNestedElement: { + prototype: HTMLIotAppKitVisWebglContextNestedElement; + new (): HTMLIotAppKitVisWebglContextNestedElement; }; - interface HTMLScWebglChartTooltipWithMultipleDataStreamsElement extends Components.ScWebglChartTooltipWithMultipleDataStreams, HTMLStencilElement { + interface HTMLIotAppKitVisWebglContextRootElement extends Components.IotAppKitVisWebglContextRoot, HTMLStencilElement { } - var HTMLScWebglChartTooltipWithMultipleDataStreamsElement: { - prototype: HTMLScWebglChartTooltipWithMultipleDataStreamsElement; - new (): HTMLScWebglChartTooltipWithMultipleDataStreamsElement; + var HTMLIotAppKitVisWebglContextRootElement: { + prototype: HTMLIotAppKitVisWebglContextRootElement; + new (): HTMLIotAppKitVisWebglContextRootElement; }; - interface HTMLScWebglContextElement extends Components.ScWebglContext, HTMLStencilElement { + interface HTMLIotAppKitVisWebglLineChartDynamicBufferElement extends Components.IotAppKitVisWebglLineChartDynamicBuffer, HTMLStencilElement { } - var HTMLScWebglContextElement: { - prototype: HTMLScWebglContextElement; - new (): HTMLScWebglContextElement; + var HTMLIotAppKitVisWebglLineChartDynamicBufferElement: { + prototype: HTMLIotAppKitVisWebglLineChartDynamicBufferElement; + new (): HTMLIotAppKitVisWebglLineChartDynamicBufferElement; }; - interface HTMLScWebglContextNestedElement extends Components.ScWebglContextNested, HTMLStencilElement { + interface HTMLIotAppKitVisWebglLineChartDynamicDataElement extends Components.IotAppKitVisWebglLineChartDynamicData, HTMLStencilElement { } - var HTMLScWebglContextNestedElement: { - prototype: HTMLScWebglContextNestedElement; - new (): HTMLScWebglContextNestedElement; + var HTMLIotAppKitVisWebglLineChartDynamicDataElement: { + prototype: HTMLIotAppKitVisWebglLineChartDynamicDataElement; + new (): HTMLIotAppKitVisWebglLineChartDynamicDataElement; }; - interface HTMLScWebglContextRootElement extends Components.ScWebglContextRoot, HTMLStencilElement { + interface HTMLIotAppKitVisWebglLineChartDynamicDataStreamsElement extends Components.IotAppKitVisWebglLineChartDynamicDataStreams, HTMLStencilElement { } - var HTMLScWebglContextRootElement: { - prototype: HTMLScWebglContextRootElement; - new (): HTMLScWebglContextRootElement; + var HTMLIotAppKitVisWebglLineChartDynamicDataStreamsElement: { + prototype: HTMLIotAppKitVisWebglLineChartDynamicDataStreamsElement; + new (): HTMLIotAppKitVisWebglLineChartDynamicDataStreamsElement; }; - interface HTMLScWebglLineChartDynamicBufferElement extends Components.ScWebglLineChartDynamicBuffer, HTMLStencilElement { + interface HTMLLineChartUnsupportedDataTypesElement extends Components.LineChartUnsupportedDataTypes, HTMLStencilElement { } - var HTMLScWebglLineChartDynamicBufferElement: { - prototype: HTMLScWebglLineChartDynamicBufferElement; - new (): HTMLScWebglLineChartDynamicBufferElement; + var HTMLLineChartUnsupportedDataTypesElement: { + prototype: HTMLLineChartUnsupportedDataTypesElement; + new (): HTMLLineChartUnsupportedDataTypesElement; }; - interface HTMLScWebglLineChartDynamicDataElement extends Components.ScWebglLineChartDynamicData, HTMLStencilElement { + interface HTMLLineChartViewportChangeElement extends Components.LineChartViewportChange, HTMLStencilElement { } - var HTMLScWebglLineChartDynamicDataElement: { - prototype: HTMLScWebglLineChartDynamicDataElement; - new (): HTMLScWebglLineChartDynamicDataElement; + var HTMLLineChartViewportChangeElement: { + prototype: HTMLLineChartViewportChangeElement; + new (): HTMLLineChartViewportChangeElement; }; - interface HTMLScWebglLineChartDynamicDataStreamsElement extends Components.ScWebglLineChartDynamicDataStreams, HTMLStencilElement { + interface HTMLMultipleStatusesElement extends Components.MultipleStatuses, HTMLStencilElement { } - var HTMLScWebglLineChartDynamicDataStreamsElement: { - prototype: HTMLScWebglLineChartDynamicDataStreamsElement; - new (): HTMLScWebglLineChartDynamicDataStreamsElement; + var HTMLMultipleStatusesElement: { + prototype: HTMLMultipleStatusesElement; + new (): HTMLMultipleStatusesElement; }; interface HTMLSingleColoredStatusElement extends Components.SingleColoredStatus, HTMLStencilElement { } @@ -1158,98 +1158,98 @@ declare global { new (): HTMLWidgetTestRouteElement; }; interface HTMLElementTagNameMap { + "iot-app-kit-vis-angled-line-segment": HTMLIotAppKitVisAngledLineSegmentElement; + "iot-app-kit-vis-annotations-draggable-multi": HTMLIotAppKitVisAnnotationsDraggableMultiElement; + "iot-app-kit-vis-app": HTMLIotAppKitVisAppElement; + "iot-app-kit-vis-bar-chart": HTMLIotAppKitVisBarChartElement; + "iot-app-kit-vis-box": HTMLIotAppKitVisBoxElement; + "iot-app-kit-vis-chart-icon": HTMLIotAppKitVisChartIconElement; + "iot-app-kit-vis-chart-y-range": HTMLIotAppKitVisChartYRangeElement; + "iot-app-kit-vis-circle-point-shaders": HTMLIotAppKitVisCirclePointShadersElement; + "iot-app-kit-vis-data-stream-name": HTMLIotAppKitVisDataStreamNameElement; + "iot-app-kit-vis-error-badge": HTMLIotAppKitVisErrorBadgeElement; + "iot-app-kit-vis-expandable-input": HTMLIotAppKitVisExpandableInputElement; + "iot-app-kit-vis-expandable-input-standard": HTMLIotAppKitVisExpandableInputStandardElement; + "iot-app-kit-vis-gesture-handler": HTMLIotAppKitVisGestureHandlerElement; + "iot-app-kit-vis-legend": HTMLIotAppKitVisLegendElement; + "iot-app-kit-vis-legend-row": HTMLIotAppKitVisLegendRowElement; + "iot-app-kit-vis-line-chart": HTMLIotAppKitVisLineChartElement; + "iot-app-kit-vis-line-chart-colored-point": HTMLIotAppKitVisLineChartColoredPointElement; + "iot-app-kit-vis-line-chart-stream-data": HTMLIotAppKitVisLineChartStreamDataElement; + "iot-app-kit-vis-loading-spinner": HTMLIotAppKitVisLoadingSpinnerElement; + "iot-app-kit-vis-multiple-bars": HTMLIotAppKitVisMultipleBarsElement; + "iot-app-kit-vis-multiple-lines": HTMLIotAppKitVisMultipleLinesElement; + "iot-app-kit-vis-multiple-lines-overlapping": HTMLIotAppKitVisMultipleLinesOverlappingElement; + "iot-app-kit-vis-scatter-chart": HTMLIotAppKitVisScatterChartElement; + "iot-app-kit-vis-scatter-chart-dynamic-data": HTMLIotAppKitVisScatterChartDynamicDataElement; + "iot-app-kit-vis-scatter-chart-threshold": HTMLIotAppKitVisScatterChartThresholdElement; + "iot-app-kit-vis-scatter-chart-threshold-coloration-band": HTMLIotAppKitVisScatterChartThresholdColorationBandElement; + "iot-app-kit-vis-scatter-chart-threshold-coloration-exact-point": HTMLIotAppKitVisScatterChartThresholdColorationExactPointElement; + "iot-app-kit-vis-scatter-chart-threshold-coloration-multiple-data-stream": HTMLIotAppKitVisScatterChartThresholdColorationMultipleDataStreamElement; + "iot-app-kit-vis-scatter-chart-threshold-coloration-multiple-thresholds": HTMLIotAppKitVisScatterChartThresholdColorationMultipleThresholdsElement; + "iot-app-kit-vis-scatter-chart-threshold-no-coloration": HTMLIotAppKitVisScatterChartThresholdNoColorationElement; + "iot-app-kit-vis-scatter-chart-tooltip-with-multiple-data-streams-and-trends": HTMLIotAppKitVisScatterChartTooltipWithMultipleDataStreamsAndTrendsElement; + "iot-app-kit-vis-scatter-chart-trend-line-color-configuration": HTMLIotAppKitVisScatterChartTrendLineColorConfigurationElement; + "iot-app-kit-vis-scatter-chart-trend-line-with-legend": HTMLIotAppKitVisScatterChartTrendLineWithLegendElement; + "iot-app-kit-vis-scatter-chart-unsupported-data-types": HTMLIotAppKitVisScatterChartUnsupportedDataTypesElement; + "iot-app-kit-vis-single-bar": HTMLIotAppKitVisSingleBarElement; + "iot-app-kit-vis-single-colored-bar": HTMLIotAppKitVisSingleColoredBarElement; + "iot-app-kit-vis-size-provider": HTMLIotAppKitVisSizeProviderElement; + "iot-app-kit-vis-size-provider-standard": HTMLIotAppKitVisSizeProviderStandardElement; + "iot-app-kit-vis-status-timeline": HTMLIotAppKitVisStatusTimelineElement; + "iot-app-kit-vis-status-timeline-overlay": HTMLIotAppKitVisStatusTimelineOverlayElement; + "iot-app-kit-vis-status-timeline-overlay-row": HTMLIotAppKitVisStatusTimelineOverlayRowElement; + "iot-app-kit-vis-straight-line-segment": HTMLIotAppKitVisStraightLineSegmentElement; + "iot-app-kit-vis-straight-line-segment-colored": HTMLIotAppKitVisStraightLineSegmentColoredElement; + "iot-app-kit-vis-threshold-legend": HTMLIotAppKitVisThresholdLegendElement; + "iot-app-kit-vis-threshold-legend-row": HTMLIotAppKitVisThresholdLegendRowElement; + "iot-app-kit-vis-tooltip": HTMLIotAppKitVisTooltipElement; + "iot-app-kit-vis-tooltip-row": HTMLIotAppKitVisTooltipRowElement; + "iot-app-kit-vis-tooltip-rows": HTMLIotAppKitVisTooltipRowsElement; + "iot-app-kit-vis-webgl-axis": HTMLIotAppKitVisWebglAxisElement; + "iot-app-kit-vis-webgl-bar-chart-dynamic-buffer": HTMLIotAppKitVisWebglBarChartDynamicBufferElement; + "iot-app-kit-vis-webgl-bar-chart-dynamic-data": HTMLIotAppKitVisWebglBarChartDynamicDataElement; + "iot-app-kit-vis-webgl-bar-chart-dynamic-data-streams": HTMLIotAppKitVisWebglBarChartDynamicDataStreamsElement; + "iot-app-kit-vis-webgl-bar-chart-fast-viewport": HTMLIotAppKitVisWebglBarChartFastViewportElement; + "iot-app-kit-vis-webgl-bar-chart-margin": HTMLIotAppKitVisWebglBarChartMarginElement; + "iot-app-kit-vis-webgl-bar-chart-negative": HTMLIotAppKitVisWebglBarChartNegativeElement; + "iot-app-kit-vis-webgl-bar-chart-positive-negative": HTMLIotAppKitVisWebglBarChartPositiveNegativeElement; + "iot-app-kit-vis-webgl-bar-chart-standard": HTMLIotAppKitVisWebglBarChartStandardElement; + "iot-app-kit-vis-webgl-bar-chart-start-from-zero": HTMLIotAppKitVisWebglBarChartStartFromZeroElement; + "iot-app-kit-vis-webgl-bar-chart-threshold-coloration": HTMLIotAppKitVisWebglBarChartThresholdColorationElement; + "iot-app-kit-vis-webgl-bar-chart-threshold-coloration-band": HTMLIotAppKitVisWebglBarChartThresholdColorationBandElement; + "iot-app-kit-vis-webgl-bar-chart-threshold-coloration-exact-point": HTMLIotAppKitVisWebglBarChartThresholdColorationExactPointElement; + "iot-app-kit-vis-webgl-bar-chart-threshold-coloration-multiple-data-stream": HTMLIotAppKitVisWebglBarChartThresholdColorationMultipleDataStreamElement; + "iot-app-kit-vis-webgl-bar-chart-threshold-coloration-multiple-thresholds": HTMLIotAppKitVisWebglBarChartThresholdColorationMultipleThresholdsElement; + "iot-app-kit-vis-webgl-bar-chart-threshold-no-coloration": HTMLIotAppKitVisWebglBarChartThresholdNoColorationElement; + "iot-app-kit-vis-webgl-bar-chart-unsupported-data-types": HTMLIotAppKitVisWebglBarChartUnsupportedDataTypesElement; + "iot-app-kit-vis-webgl-base-chart": HTMLIotAppKitVisWebglBaseChartElement; + "iot-app-kit-vis-webgl-chart-annotation-editable": HTMLIotAppKitVisWebglChartAnnotationEditableElement; + "iot-app-kit-vis-webgl-chart-annotations": HTMLIotAppKitVisWebglChartAnnotationsElement; + "iot-app-kit-vis-webgl-chart-annotations-always-in-viewport": HTMLIotAppKitVisWebglChartAnnotationsAlwaysInViewportElement; + "iot-app-kit-vis-webgl-chart-axis": HTMLIotAppKitVisWebglChartAxisElement; + "iot-app-kit-vis-webgl-chart-dynamic-charts": HTMLIotAppKitVisWebglChartDynamicChartsElement; + "iot-app-kit-vis-webgl-chart-large-viewport": HTMLIotAppKitVisWebglChartLargeViewportElement; + "iot-app-kit-vis-webgl-chart-multi": HTMLIotAppKitVisWebglChartMultiElement; + "iot-app-kit-vis-webgl-chart-no-annotations": HTMLIotAppKitVisWebglChartNoAnnotationsElement; + "iot-app-kit-vis-webgl-chart-standard": HTMLIotAppKitVisWebglChartStandardElement; + "iot-app-kit-vis-webgl-chart-standard-with-legend": HTMLIotAppKitVisWebglChartStandardWithLegendElement; + "iot-app-kit-vis-webgl-chart-standard-with-legend-on-right": HTMLIotAppKitVisWebglChartStandardWithLegendOnRightElement; + "iot-app-kit-vis-webgl-chart-threshold-coloration-band": HTMLIotAppKitVisWebglChartThresholdColorationBandElement; + "iot-app-kit-vis-webgl-chart-threshold-coloration-exact-point": HTMLIotAppKitVisWebglChartThresholdColorationExactPointElement; + "iot-app-kit-vis-webgl-chart-threshold-coloration-multiple-data-stream": HTMLIotAppKitVisWebglChartThresholdColorationMultipleDataStreamElement; + "iot-app-kit-vis-webgl-chart-threshold-coloration-multiple-thresholds": HTMLIotAppKitVisWebglChartThresholdColorationMultipleThresholdsElement; + "iot-app-kit-vis-webgl-chart-threshold-coloration-split-half": HTMLIotAppKitVisWebglChartThresholdColorationSplitHalfElement; + "iot-app-kit-vis-webgl-chart-tooltip-with-multiple-data-streams": HTMLIotAppKitVisWebglChartTooltipWithMultipleDataStreamsElement; + "iot-app-kit-vis-webgl-context": HTMLIotAppKitVisWebglContextElement; + "iot-app-kit-vis-webgl-context-nested": HTMLIotAppKitVisWebglContextNestedElement; + "iot-app-kit-vis-webgl-context-root": HTMLIotAppKitVisWebglContextRootElement; + "iot-app-kit-vis-webgl-line-chart-dynamic-buffer": HTMLIotAppKitVisWebglLineChartDynamicBufferElement; + "iot-app-kit-vis-webgl-line-chart-dynamic-data": HTMLIotAppKitVisWebglLineChartDynamicDataElement; + "iot-app-kit-vis-webgl-line-chart-dynamic-data-streams": HTMLIotAppKitVisWebglLineChartDynamicDataStreamsElement; "line-chart-unsupported-data-types": HTMLLineChartUnsupportedDataTypesElement; "line-chart-viewport-change": HTMLLineChartViewportChangeElement; "multiple-statuses": HTMLMultipleStatusesElement; - "sc-angled-line-segment": HTMLScAngledLineSegmentElement; - "sc-annotations-draggable-multi": HTMLScAnnotationsDraggableMultiElement; - "sc-app": HTMLScAppElement; - "sc-bar-chart": HTMLScBarChartElement; - "sc-box": HTMLScBoxElement; - "sc-chart-icon": HTMLScChartIconElement; - "sc-chart-y-range": HTMLScChartYRangeElement; - "sc-circle-point-shaders": HTMLScCirclePointShadersElement; - "sc-data-stream-name": HTMLScDataStreamNameElement; - "sc-error-badge": HTMLScErrorBadgeElement; - "sc-expandable-input": HTMLScExpandableInputElement; - "sc-expandable-input-standard": HTMLScExpandableInputStandardElement; - "sc-gesture-handler": HTMLScGestureHandlerElement; - "sc-legend": HTMLScLegendElement; - "sc-legend-row": HTMLScLegendRowElement; - "sc-line-chart": HTMLScLineChartElement; - "sc-line-chart-colored-point": HTMLScLineChartColoredPointElement; - "sc-line-chart-stream-data": HTMLScLineChartStreamDataElement; - "sc-loading-spinner": HTMLScLoadingSpinnerElement; - "sc-multiple-bars": HTMLScMultipleBarsElement; - "sc-multiple-lines": HTMLScMultipleLinesElement; - "sc-multiple-lines-overlapping": HTMLScMultipleLinesOverlappingElement; - "sc-scatter-chart": HTMLScScatterChartElement; - "sc-scatter-chart-dynamic-data": HTMLScScatterChartDynamicDataElement; - "sc-scatter-chart-threshold": HTMLScScatterChartThresholdElement; - "sc-scatter-chart-threshold-coloration-band": HTMLScScatterChartThresholdColorationBandElement; - "sc-scatter-chart-threshold-coloration-exact-point": HTMLScScatterChartThresholdColorationExactPointElement; - "sc-scatter-chart-threshold-coloration-multiple-data-stream": HTMLScScatterChartThresholdColorationMultipleDataStreamElement; - "sc-scatter-chart-threshold-coloration-multiple-thresholds": HTMLScScatterChartThresholdColorationMultipleThresholdsElement; - "sc-scatter-chart-threshold-no-coloration": HTMLScScatterChartThresholdNoColorationElement; - "sc-scatter-chart-tooltip-with-multiple-data-streams-and-trends": HTMLScScatterChartTooltipWithMultipleDataStreamsAndTrendsElement; - "sc-scatter-chart-trend-line-color-configuration": HTMLScScatterChartTrendLineColorConfigurationElement; - "sc-scatter-chart-trend-line-with-legend": HTMLScScatterChartTrendLineWithLegendElement; - "sc-scatter-chart-unsupported-data-types": HTMLScScatterChartUnsupportedDataTypesElement; - "sc-single-bar": HTMLScSingleBarElement; - "sc-single-colored-bar": HTMLScSingleColoredBarElement; - "sc-size-provider": HTMLScSizeProviderElement; - "sc-size-provider-standard": HTMLScSizeProviderStandardElement; - "sc-status-timeline": HTMLScStatusTimelineElement; - "sc-status-timeline-overlay": HTMLScStatusTimelineOverlayElement; - "sc-status-timeline-overlay-row": HTMLScStatusTimelineOverlayRowElement; - "sc-straight-line-segment": HTMLScStraightLineSegmentElement; - "sc-straight-line-segment-colored": HTMLScStraightLineSegmentColoredElement; - "sc-threshold-legend": HTMLScThresholdLegendElement; - "sc-threshold-legend-row": HTMLScThresholdLegendRowElement; - "sc-tooltip": HTMLScTooltipElement; - "sc-tooltip-row": HTMLScTooltipRowElement; - "sc-tooltip-rows": HTMLScTooltipRowsElement; - "sc-webgl-axis": HTMLScWebglAxisElement; - "sc-webgl-bar-chart-dynamic-buffer": HTMLScWebglBarChartDynamicBufferElement; - "sc-webgl-bar-chart-dynamic-data": HTMLScWebglBarChartDynamicDataElement; - "sc-webgl-bar-chart-dynamic-data-streams": HTMLScWebglBarChartDynamicDataStreamsElement; - "sc-webgl-bar-chart-fast-viewport": HTMLScWebglBarChartFastViewportElement; - "sc-webgl-bar-chart-margin": HTMLScWebglBarChartMarginElement; - "sc-webgl-bar-chart-negative": HTMLScWebglBarChartNegativeElement; - "sc-webgl-bar-chart-positive-negative": HTMLScWebglBarChartPositiveNegativeElement; - "sc-webgl-bar-chart-standard": HTMLScWebglBarChartStandardElement; - "sc-webgl-bar-chart-start-from-zero": HTMLScWebglBarChartStartFromZeroElement; - "sc-webgl-bar-chart-threshold-coloration": HTMLScWebglBarChartThresholdColorationElement; - "sc-webgl-bar-chart-threshold-coloration-band": HTMLScWebglBarChartThresholdColorationBandElement; - "sc-webgl-bar-chart-threshold-coloration-exact-point": HTMLScWebglBarChartThresholdColorationExactPointElement; - "sc-webgl-bar-chart-threshold-coloration-multiple-data-stream": HTMLScWebglBarChartThresholdColorationMultipleDataStreamElement; - "sc-webgl-bar-chart-threshold-coloration-multiple-thresholds": HTMLScWebglBarChartThresholdColorationMultipleThresholdsElement; - "sc-webgl-bar-chart-threshold-no-coloration": HTMLScWebglBarChartThresholdNoColorationElement; - "sc-webgl-bar-chart-unsupported-data-types": HTMLScWebglBarChartUnsupportedDataTypesElement; - "sc-webgl-base-chart": HTMLScWebglBaseChartElement; - "sc-webgl-chart-annotation-editable": HTMLScWebglChartAnnotationEditableElement; - "sc-webgl-chart-annotations": HTMLScWebglChartAnnotationsElement; - "sc-webgl-chart-annotations-always-in-viewport": HTMLScWebglChartAnnotationsAlwaysInViewportElement; - "sc-webgl-chart-axis": HTMLScWebglChartAxisElement; - "sc-webgl-chart-dynamic-charts": HTMLScWebglChartDynamicChartsElement; - "sc-webgl-chart-large-viewport": HTMLScWebglChartLargeViewportElement; - "sc-webgl-chart-multi": HTMLScWebglChartMultiElement; - "sc-webgl-chart-no-annotations": HTMLScWebglChartNoAnnotationsElement; - "sc-webgl-chart-standard": HTMLScWebglChartStandardElement; - "sc-webgl-chart-standard-with-legend": HTMLScWebglChartStandardWithLegendElement; - "sc-webgl-chart-standard-with-legend-on-right": HTMLScWebglChartStandardWithLegendOnRightElement; - "sc-webgl-chart-threshold-coloration-band": HTMLScWebglChartThresholdColorationBandElement; - "sc-webgl-chart-threshold-coloration-exact-point": HTMLScWebglChartThresholdColorationExactPointElement; - "sc-webgl-chart-threshold-coloration-multiple-data-stream": HTMLScWebglChartThresholdColorationMultipleDataStreamElement; - "sc-webgl-chart-threshold-coloration-multiple-thresholds": HTMLScWebglChartThresholdColorationMultipleThresholdsElement; - "sc-webgl-chart-threshold-coloration-split-half": HTMLScWebglChartThresholdColorationSplitHalfElement; - "sc-webgl-chart-tooltip-with-multiple-data-streams": HTMLScWebglChartTooltipWithMultipleDataStreamsElement; - "sc-webgl-context": HTMLScWebglContextElement; - "sc-webgl-context-nested": HTMLScWebglContextNestedElement; - "sc-webgl-context-root": HTMLScWebglContextRootElement; - "sc-webgl-line-chart-dynamic-buffer": HTMLScWebglLineChartDynamicBufferElement; - "sc-webgl-line-chart-dynamic-data": HTMLScWebglLineChartDynamicDataElement; - "sc-webgl-line-chart-dynamic-data-streams": HTMLScWebglLineChartDynamicDataStreamsElement; "single-colored-status": HTMLSingleColoredStatusElement; "single-status": HTMLSingleStatusElement; "status-timeline-dynamic-buffer": HTMLStatusTimelineDynamicBufferElement; @@ -1271,19 +1271,13 @@ declare global { } } declare namespace LocalJSX { - interface LineChartUnsupportedDataTypes { - } - interface LineChartViewportChange { - } - interface MultipleStatuses { - } - interface ScAngledLineSegment { + interface IotAppKitVisAngledLineSegment { } - interface ScAnnotationsDraggableMulti { + interface IotAppKitVisAnnotationsDraggableMulti { } - interface ScApp { + interface IotAppKitVisApp { } - interface ScBarChart { + interface IotAppKitVisBarChart { "alarms"?: AlarmsConfig; "annotations"?: Annotations; "axis"?: Axis.Options; @@ -1311,21 +1305,21 @@ declare namespace LocalJSX { "viewport"?: MinimalViewPortConfig; "widgetId": string; } - interface ScBox { + interface IotAppKitVisBox { "size"?: MinimalSizeConfig; "someObject"?: Object; } - interface ScChartIcon { + interface IotAppKitVisChartIcon { "color"?: string; "name"?: StatusIcon; "size"?: number; } - interface ScChartYRange { + interface IotAppKitVisChartYRange { "component"?: string; } - interface ScCirclePointShaders { + interface IotAppKitVisCirclePointShaders { } - interface ScDataStreamName { + interface IotAppKitVisDataStreamName { "date"?: Date; "detailedLabel"?: string; "displayTooltip"?: boolean; @@ -1334,21 +1328,21 @@ declare namespace LocalJSX { "onNameChange": (name: string) => void; "pointType"?: POINT_TYPE; } - interface ScErrorBadge { + interface IotAppKitVisErrorBadge { } - interface ScExpandableInput { + interface IotAppKitVisExpandableInput { "isDisabled"?: boolean; "onValueChange": (value: string) => void; "value": string; } - interface ScExpandableInputStandard { + interface IotAppKitVisExpandableInputStandard { } - interface ScGestureHandler { + interface IotAppKitVisGestureHandler { "onDateRangeChange": ({ end, start }: { start: Date; end: Date }) => void; "size": SizeConfig; "viewport": ViewPort; } - interface ScLegend { + interface IotAppKitVisLegend { "config": LegendConfig; "dataStreams": DataStream[]; "isEditing"?: boolean; @@ -1361,7 +1355,7 @@ declare namespace LocalJSX { "viewport": ViewPort; "visualizesAlarms": boolean; } - interface ScLegendRow { + interface IotAppKitVisLegendRow { "color": string; "detailedLabel"?: string; "icon"?: StatusIcon; @@ -1376,7 +1370,7 @@ declare namespace LocalJSX { "updateDataStreamName": ({ streamId, name }: { streamId: string; name: string }) => void; "valueColor"?: string; } - interface ScLineChart { + interface IotAppKitVisLineChart { "alarms"?: AlarmsConfig; "annotations"?: Annotations; "axis"?: Axis.Options; @@ -1404,21 +1398,21 @@ declare namespace LocalJSX { "viewport": MinimalViewPortConfig; "widgetId": string; } - interface ScLineChartColoredPoint { + interface IotAppKitVisLineChartColoredPoint { } - interface ScLineChartStreamData { + interface IotAppKitVisLineChartStreamData { } - interface ScLoadingSpinner { + interface IotAppKitVisLoadingSpinner { "dark"?: boolean; "size"?: number; } - interface ScMultipleBars { + interface IotAppKitVisMultipleBars { } - interface ScMultipleLines { + interface IotAppKitVisMultipleLines { } - interface ScMultipleLinesOverlapping { + interface IotAppKitVisMultipleLinesOverlapping { } - interface ScScatterChart { + interface IotAppKitVisScatterChart { "alarms"?: AlarmsConfig; "annotations"?: Annotations; "axis"?: Axis.Options; @@ -1446,42 +1440,42 @@ declare namespace LocalJSX { "viewport"?: MinimalViewPortConfig; "widgetId": string; } - interface ScScatterChartDynamicData { + interface IotAppKitVisScatterChartDynamicData { } - interface ScScatterChartThreshold { + interface IotAppKitVisScatterChartThreshold { } - interface ScScatterChartThresholdColorationBand { + interface IotAppKitVisScatterChartThresholdColorationBand { } - interface ScScatterChartThresholdColorationExactPoint { + interface IotAppKitVisScatterChartThresholdColorationExactPoint { } - interface ScScatterChartThresholdColorationMultipleDataStream { + interface IotAppKitVisScatterChartThresholdColorationMultipleDataStream { } - interface ScScatterChartThresholdColorationMultipleThresholds { + interface IotAppKitVisScatterChartThresholdColorationMultipleThresholds { } - interface ScScatterChartThresholdNoColoration { + interface IotAppKitVisScatterChartThresholdNoColoration { } - interface ScScatterChartTooltipWithMultipleDataStreamsAndTrends { + interface IotAppKitVisScatterChartTooltipWithMultipleDataStreamsAndTrends { } - interface ScScatterChartTrendLineColorConfiguration { + interface IotAppKitVisScatterChartTrendLineColorConfiguration { } - interface ScScatterChartTrendLineWithLegend { + interface IotAppKitVisScatterChartTrendLineWithLegend { } - interface ScScatterChartUnsupportedDataTypes { + interface IotAppKitVisScatterChartUnsupportedDataTypes { } - interface ScSingleBar { + interface IotAppKitVisSingleBar { } - interface ScSingleColoredBar { + interface IotAppKitVisSingleColoredBar { } - interface ScSizeProvider { + interface IotAppKitVisSizeProvider { "renderFunc": (rect: RectScrollFixed) => void; /** * Size overrides. these will take precident over any auto-calculated sizing */ "size"?: MinimalSizeConfig; } - interface ScSizeProviderStandard { + interface IotAppKitVisSizeProviderStandard { } - interface ScStatusTimeline { + interface IotAppKitVisStatusTimeline { "alarms"?: AlarmsConfig; "annotations"?: Annotations; "axis"?: Axis.Options; @@ -1507,7 +1501,7 @@ declare namespace LocalJSX { "viewport"?: MinimalViewPortConfig; "widgetId": string; } - interface ScStatusTimelineOverlay { + interface IotAppKitVisStatusTimelineOverlay { "dataStreams": DataStream[]; "date": Date; "isEditing": boolean; @@ -1516,7 +1510,7 @@ declare namespace LocalJSX { "thresholds": Threshold[]; "widgetId": string; } - interface ScStatusTimelineOverlayRow { + interface IotAppKitVisStatusTimelineOverlayRow { "detailedLabel"?: string; "icon"?: StatusIcon; "isEditing": boolean; @@ -1526,18 +1520,18 @@ declare namespace LocalJSX { "value"?: Primitive; "valueColor"?: string; } - interface ScStraightLineSegment { + interface IotAppKitVisStraightLineSegment { } - interface ScStraightLineSegmentColored { + interface IotAppKitVisStraightLineSegmentColored { } - interface ScThresholdLegend { + interface IotAppKitVisThresholdLegend { "thresholds": Threshold[]; } - interface ScThresholdLegendRow { + interface IotAppKitVisThresholdLegendRow { "color": string; "label": string; } - interface ScTooltip { + interface IotAppKitVisTooltip { /** * If we are drawing data from the data timestamp to timestamp + resolution we want the tooltip to align on the left side Otherwise we are drawing the data from timestamp - resolution to timestamp then we want the tooltip to align on the right side */ @@ -1559,7 +1553,7 @@ declare namespace LocalJSX { "viewport": ViewPort; "visualizesAlarms": boolean; } - interface ScTooltipRow { + interface IotAppKitVisTooltipRow { "aggregationType"?: string; "color": string; "icon"?: StatusIcon; @@ -1570,7 +1564,7 @@ declare namespace LocalJSX { "showDataStreamColor": boolean; "valueColor"?: string; } - interface ScTooltipRows { + interface IotAppKitVisTooltipRows { /** * If we are drawing data from the data timestamp to timestamp + resolution we want the tooltip to align on the left side Otherwise we are drawing the data from timestamp - resolution to timestamp then we want the tooltip to align on the right side */ @@ -1592,42 +1586,42 @@ declare namespace LocalJSX { "viewport": ViewPort; "visualizesAlarms": boolean; } - interface ScWebglAxis { + interface IotAppKitVisWebglAxis { "size": SizeConfig; } - interface ScWebglBarChartDynamicBuffer { + interface IotAppKitVisWebglBarChartDynamicBuffer { } - interface ScWebglBarChartDynamicData { + interface IotAppKitVisWebglBarChartDynamicData { } - interface ScWebglBarChartDynamicDataStreams { + interface IotAppKitVisWebglBarChartDynamicDataStreams { } - interface ScWebglBarChartFastViewport { + interface IotAppKitVisWebglBarChartFastViewport { } - interface ScWebglBarChartMargin { + interface IotAppKitVisWebglBarChartMargin { } - interface ScWebglBarChartNegative { + interface IotAppKitVisWebglBarChartNegative { } - interface ScWebglBarChartPositiveNegative { + interface IotAppKitVisWebglBarChartPositiveNegative { } - interface ScWebglBarChartStandard { + interface IotAppKitVisWebglBarChartStandard { } - interface ScWebglBarChartStartFromZero { + interface IotAppKitVisWebglBarChartStartFromZero { } - interface ScWebglBarChartThresholdColoration { + interface IotAppKitVisWebglBarChartThresholdColoration { } - interface ScWebglBarChartThresholdColorationBand { + interface IotAppKitVisWebglBarChartThresholdColorationBand { } - interface ScWebglBarChartThresholdColorationExactPoint { + interface IotAppKitVisWebglBarChartThresholdColorationExactPoint { } - interface ScWebglBarChartThresholdColorationMultipleDataStream { + interface IotAppKitVisWebglBarChartThresholdColorationMultipleDataStream { } - interface ScWebglBarChartThresholdColorationMultipleThresholds { + interface IotAppKitVisWebglBarChartThresholdColorationMultipleThresholds { } - interface ScWebglBarChartThresholdNoColoration { + interface IotAppKitVisWebglBarChartThresholdNoColoration { } - interface ScWebglBarChartUnsupportedDataTypes { + interface IotAppKitVisWebglBarChartUnsupportedDataTypes { } - interface ScWebglBaseChart { + interface IotAppKitVisWebglBaseChart { "alarms"?: AlarmsConfig; "annotations"?: Annotations; "axis"?: Axis.Options; @@ -1672,53 +1666,59 @@ declare namespace LocalJSX { "visualizesAlarms"?: boolean; "yRangeStartFromZero"?: boolean; } - interface ScWebglChartAnnotationEditable { + interface IotAppKitVisWebglChartAnnotationEditable { } - interface ScWebglChartAnnotations { + interface IotAppKitVisWebglChartAnnotations { } - interface ScWebglChartAnnotationsAlwaysInViewport { + interface IotAppKitVisWebglChartAnnotationsAlwaysInViewport { } - interface ScWebglChartAxis { + interface IotAppKitVisWebglChartAxis { } - interface ScWebglChartDynamicCharts { + interface IotAppKitVisWebglChartDynamicCharts { } - interface ScWebglChartLargeViewport { + interface IotAppKitVisWebglChartLargeViewport { } - interface ScWebglChartMulti { + interface IotAppKitVisWebglChartMulti { } - interface ScWebglChartNoAnnotations { + interface IotAppKitVisWebglChartNoAnnotations { } - interface ScWebglChartStandard { + interface IotAppKitVisWebglChartStandard { } - interface ScWebglChartStandardWithLegend { + interface IotAppKitVisWebglChartStandardWithLegend { } - interface ScWebglChartStandardWithLegendOnRight { + interface IotAppKitVisWebglChartStandardWithLegendOnRight { } - interface ScWebglChartThresholdColorationBand { + interface IotAppKitVisWebglChartThresholdColorationBand { } - interface ScWebglChartThresholdColorationExactPoint { + interface IotAppKitVisWebglChartThresholdColorationExactPoint { } - interface ScWebglChartThresholdColorationMultipleDataStream { + interface IotAppKitVisWebglChartThresholdColorationMultipleDataStream { } - interface ScWebglChartThresholdColorationMultipleThresholds { + interface IotAppKitVisWebglChartThresholdColorationMultipleThresholds { } - interface ScWebglChartThresholdColorationSplitHalf { + interface IotAppKitVisWebglChartThresholdColorationSplitHalf { } - interface ScWebglChartTooltipWithMultipleDataStreams { + interface IotAppKitVisWebglChartTooltipWithMultipleDataStreams { } - interface ScWebglContext { + interface IotAppKitVisWebglContext { "onContextInitialization"?: (context: WebGLRenderingContext) => void; "viewFrame"?: HTMLElement | Window | undefined; } - interface ScWebglContextNested { + interface IotAppKitVisWebglContextNested { } - interface ScWebglContextRoot { + interface IotAppKitVisWebglContextRoot { } - interface ScWebglLineChartDynamicBuffer { + interface IotAppKitVisWebglLineChartDynamicBuffer { } - interface ScWebglLineChartDynamicData { + interface IotAppKitVisWebglLineChartDynamicData { } - interface ScWebglLineChartDynamicDataStreams { + interface IotAppKitVisWebglLineChartDynamicDataStreams { + } + interface LineChartUnsupportedDataTypes { + } + interface LineChartViewportChange { + } + interface MultipleStatuses { } interface SingleColoredStatus { } @@ -1759,98 +1759,98 @@ declare namespace LocalJSX { "dataStreamInfos"?: DataStreamInfo[]; } interface IntrinsicElements { + "iot-app-kit-vis-angled-line-segment": IotAppKitVisAngledLineSegment; + "iot-app-kit-vis-annotations-draggable-multi": IotAppKitVisAnnotationsDraggableMulti; + "iot-app-kit-vis-app": IotAppKitVisApp; + "iot-app-kit-vis-bar-chart": IotAppKitVisBarChart; + "iot-app-kit-vis-box": IotAppKitVisBox; + "iot-app-kit-vis-chart-icon": IotAppKitVisChartIcon; + "iot-app-kit-vis-chart-y-range": IotAppKitVisChartYRange; + "iot-app-kit-vis-circle-point-shaders": IotAppKitVisCirclePointShaders; + "iot-app-kit-vis-data-stream-name": IotAppKitVisDataStreamName; + "iot-app-kit-vis-error-badge": IotAppKitVisErrorBadge; + "iot-app-kit-vis-expandable-input": IotAppKitVisExpandableInput; + "iot-app-kit-vis-expandable-input-standard": IotAppKitVisExpandableInputStandard; + "iot-app-kit-vis-gesture-handler": IotAppKitVisGestureHandler; + "iot-app-kit-vis-legend": IotAppKitVisLegend; + "iot-app-kit-vis-legend-row": IotAppKitVisLegendRow; + "iot-app-kit-vis-line-chart": IotAppKitVisLineChart; + "iot-app-kit-vis-line-chart-colored-point": IotAppKitVisLineChartColoredPoint; + "iot-app-kit-vis-line-chart-stream-data": IotAppKitVisLineChartStreamData; + "iot-app-kit-vis-loading-spinner": IotAppKitVisLoadingSpinner; + "iot-app-kit-vis-multiple-bars": IotAppKitVisMultipleBars; + "iot-app-kit-vis-multiple-lines": IotAppKitVisMultipleLines; + "iot-app-kit-vis-multiple-lines-overlapping": IotAppKitVisMultipleLinesOverlapping; + "iot-app-kit-vis-scatter-chart": IotAppKitVisScatterChart; + "iot-app-kit-vis-scatter-chart-dynamic-data": IotAppKitVisScatterChartDynamicData; + "iot-app-kit-vis-scatter-chart-threshold": IotAppKitVisScatterChartThreshold; + "iot-app-kit-vis-scatter-chart-threshold-coloration-band": IotAppKitVisScatterChartThresholdColorationBand; + "iot-app-kit-vis-scatter-chart-threshold-coloration-exact-point": IotAppKitVisScatterChartThresholdColorationExactPoint; + "iot-app-kit-vis-scatter-chart-threshold-coloration-multiple-data-stream": IotAppKitVisScatterChartThresholdColorationMultipleDataStream; + "iot-app-kit-vis-scatter-chart-threshold-coloration-multiple-thresholds": IotAppKitVisScatterChartThresholdColorationMultipleThresholds; + "iot-app-kit-vis-scatter-chart-threshold-no-coloration": IotAppKitVisScatterChartThresholdNoColoration; + "iot-app-kit-vis-scatter-chart-tooltip-with-multiple-data-streams-and-trends": IotAppKitVisScatterChartTooltipWithMultipleDataStreamsAndTrends; + "iot-app-kit-vis-scatter-chart-trend-line-color-configuration": IotAppKitVisScatterChartTrendLineColorConfiguration; + "iot-app-kit-vis-scatter-chart-trend-line-with-legend": IotAppKitVisScatterChartTrendLineWithLegend; + "iot-app-kit-vis-scatter-chart-unsupported-data-types": IotAppKitVisScatterChartUnsupportedDataTypes; + "iot-app-kit-vis-single-bar": IotAppKitVisSingleBar; + "iot-app-kit-vis-single-colored-bar": IotAppKitVisSingleColoredBar; + "iot-app-kit-vis-size-provider": IotAppKitVisSizeProvider; + "iot-app-kit-vis-size-provider-standard": IotAppKitVisSizeProviderStandard; + "iot-app-kit-vis-status-timeline": IotAppKitVisStatusTimeline; + "iot-app-kit-vis-status-timeline-overlay": IotAppKitVisStatusTimelineOverlay; + "iot-app-kit-vis-status-timeline-overlay-row": IotAppKitVisStatusTimelineOverlayRow; + "iot-app-kit-vis-straight-line-segment": IotAppKitVisStraightLineSegment; + "iot-app-kit-vis-straight-line-segment-colored": IotAppKitVisStraightLineSegmentColored; + "iot-app-kit-vis-threshold-legend": IotAppKitVisThresholdLegend; + "iot-app-kit-vis-threshold-legend-row": IotAppKitVisThresholdLegendRow; + "iot-app-kit-vis-tooltip": IotAppKitVisTooltip; + "iot-app-kit-vis-tooltip-row": IotAppKitVisTooltipRow; + "iot-app-kit-vis-tooltip-rows": IotAppKitVisTooltipRows; + "iot-app-kit-vis-webgl-axis": IotAppKitVisWebglAxis; + "iot-app-kit-vis-webgl-bar-chart-dynamic-buffer": IotAppKitVisWebglBarChartDynamicBuffer; + "iot-app-kit-vis-webgl-bar-chart-dynamic-data": IotAppKitVisWebglBarChartDynamicData; + "iot-app-kit-vis-webgl-bar-chart-dynamic-data-streams": IotAppKitVisWebglBarChartDynamicDataStreams; + "iot-app-kit-vis-webgl-bar-chart-fast-viewport": IotAppKitVisWebglBarChartFastViewport; + "iot-app-kit-vis-webgl-bar-chart-margin": IotAppKitVisWebglBarChartMargin; + "iot-app-kit-vis-webgl-bar-chart-negative": IotAppKitVisWebglBarChartNegative; + "iot-app-kit-vis-webgl-bar-chart-positive-negative": IotAppKitVisWebglBarChartPositiveNegative; + "iot-app-kit-vis-webgl-bar-chart-standard": IotAppKitVisWebglBarChartStandard; + "iot-app-kit-vis-webgl-bar-chart-start-from-zero": IotAppKitVisWebglBarChartStartFromZero; + "iot-app-kit-vis-webgl-bar-chart-threshold-coloration": IotAppKitVisWebglBarChartThresholdColoration; + "iot-app-kit-vis-webgl-bar-chart-threshold-coloration-band": IotAppKitVisWebglBarChartThresholdColorationBand; + "iot-app-kit-vis-webgl-bar-chart-threshold-coloration-exact-point": IotAppKitVisWebglBarChartThresholdColorationExactPoint; + "iot-app-kit-vis-webgl-bar-chart-threshold-coloration-multiple-data-stream": IotAppKitVisWebglBarChartThresholdColorationMultipleDataStream; + "iot-app-kit-vis-webgl-bar-chart-threshold-coloration-multiple-thresholds": IotAppKitVisWebglBarChartThresholdColorationMultipleThresholds; + "iot-app-kit-vis-webgl-bar-chart-threshold-no-coloration": IotAppKitVisWebglBarChartThresholdNoColoration; + "iot-app-kit-vis-webgl-bar-chart-unsupported-data-types": IotAppKitVisWebglBarChartUnsupportedDataTypes; + "iot-app-kit-vis-webgl-base-chart": IotAppKitVisWebglBaseChart; + "iot-app-kit-vis-webgl-chart-annotation-editable": IotAppKitVisWebglChartAnnotationEditable; + "iot-app-kit-vis-webgl-chart-annotations": IotAppKitVisWebglChartAnnotations; + "iot-app-kit-vis-webgl-chart-annotations-always-in-viewport": IotAppKitVisWebglChartAnnotationsAlwaysInViewport; + "iot-app-kit-vis-webgl-chart-axis": IotAppKitVisWebglChartAxis; + "iot-app-kit-vis-webgl-chart-dynamic-charts": IotAppKitVisWebglChartDynamicCharts; + "iot-app-kit-vis-webgl-chart-large-viewport": IotAppKitVisWebglChartLargeViewport; + "iot-app-kit-vis-webgl-chart-multi": IotAppKitVisWebglChartMulti; + "iot-app-kit-vis-webgl-chart-no-annotations": IotAppKitVisWebglChartNoAnnotations; + "iot-app-kit-vis-webgl-chart-standard": IotAppKitVisWebglChartStandard; + "iot-app-kit-vis-webgl-chart-standard-with-legend": IotAppKitVisWebglChartStandardWithLegend; + "iot-app-kit-vis-webgl-chart-standard-with-legend-on-right": IotAppKitVisWebglChartStandardWithLegendOnRight; + "iot-app-kit-vis-webgl-chart-threshold-coloration-band": IotAppKitVisWebglChartThresholdColorationBand; + "iot-app-kit-vis-webgl-chart-threshold-coloration-exact-point": IotAppKitVisWebglChartThresholdColorationExactPoint; + "iot-app-kit-vis-webgl-chart-threshold-coloration-multiple-data-stream": IotAppKitVisWebglChartThresholdColorationMultipleDataStream; + "iot-app-kit-vis-webgl-chart-threshold-coloration-multiple-thresholds": IotAppKitVisWebglChartThresholdColorationMultipleThresholds; + "iot-app-kit-vis-webgl-chart-threshold-coloration-split-half": IotAppKitVisWebglChartThresholdColorationSplitHalf; + "iot-app-kit-vis-webgl-chart-tooltip-with-multiple-data-streams": IotAppKitVisWebglChartTooltipWithMultipleDataStreams; + "iot-app-kit-vis-webgl-context": IotAppKitVisWebglContext; + "iot-app-kit-vis-webgl-context-nested": IotAppKitVisWebglContextNested; + "iot-app-kit-vis-webgl-context-root": IotAppKitVisWebglContextRoot; + "iot-app-kit-vis-webgl-line-chart-dynamic-buffer": IotAppKitVisWebglLineChartDynamicBuffer; + "iot-app-kit-vis-webgl-line-chart-dynamic-data": IotAppKitVisWebglLineChartDynamicData; + "iot-app-kit-vis-webgl-line-chart-dynamic-data-streams": IotAppKitVisWebglLineChartDynamicDataStreams; "line-chart-unsupported-data-types": LineChartUnsupportedDataTypes; "line-chart-viewport-change": LineChartViewportChange; "multiple-statuses": MultipleStatuses; - "sc-angled-line-segment": ScAngledLineSegment; - "sc-annotations-draggable-multi": ScAnnotationsDraggableMulti; - "sc-app": ScApp; - "sc-bar-chart": ScBarChart; - "sc-box": ScBox; - "sc-chart-icon": ScChartIcon; - "sc-chart-y-range": ScChartYRange; - "sc-circle-point-shaders": ScCirclePointShaders; - "sc-data-stream-name": ScDataStreamName; - "sc-error-badge": ScErrorBadge; - "sc-expandable-input": ScExpandableInput; - "sc-expandable-input-standard": ScExpandableInputStandard; - "sc-gesture-handler": ScGestureHandler; - "sc-legend": ScLegend; - "sc-legend-row": ScLegendRow; - "sc-line-chart": ScLineChart; - "sc-line-chart-colored-point": ScLineChartColoredPoint; - "sc-line-chart-stream-data": ScLineChartStreamData; - "sc-loading-spinner": ScLoadingSpinner; - "sc-multiple-bars": ScMultipleBars; - "sc-multiple-lines": ScMultipleLines; - "sc-multiple-lines-overlapping": ScMultipleLinesOverlapping; - "sc-scatter-chart": ScScatterChart; - "sc-scatter-chart-dynamic-data": ScScatterChartDynamicData; - "sc-scatter-chart-threshold": ScScatterChartThreshold; - "sc-scatter-chart-threshold-coloration-band": ScScatterChartThresholdColorationBand; - "sc-scatter-chart-threshold-coloration-exact-point": ScScatterChartThresholdColorationExactPoint; - "sc-scatter-chart-threshold-coloration-multiple-data-stream": ScScatterChartThresholdColorationMultipleDataStream; - "sc-scatter-chart-threshold-coloration-multiple-thresholds": ScScatterChartThresholdColorationMultipleThresholds; - "sc-scatter-chart-threshold-no-coloration": ScScatterChartThresholdNoColoration; - "sc-scatter-chart-tooltip-with-multiple-data-streams-and-trends": ScScatterChartTooltipWithMultipleDataStreamsAndTrends; - "sc-scatter-chart-trend-line-color-configuration": ScScatterChartTrendLineColorConfiguration; - "sc-scatter-chart-trend-line-with-legend": ScScatterChartTrendLineWithLegend; - "sc-scatter-chart-unsupported-data-types": ScScatterChartUnsupportedDataTypes; - "sc-single-bar": ScSingleBar; - "sc-single-colored-bar": ScSingleColoredBar; - "sc-size-provider": ScSizeProvider; - "sc-size-provider-standard": ScSizeProviderStandard; - "sc-status-timeline": ScStatusTimeline; - "sc-status-timeline-overlay": ScStatusTimelineOverlay; - "sc-status-timeline-overlay-row": ScStatusTimelineOverlayRow; - "sc-straight-line-segment": ScStraightLineSegment; - "sc-straight-line-segment-colored": ScStraightLineSegmentColored; - "sc-threshold-legend": ScThresholdLegend; - "sc-threshold-legend-row": ScThresholdLegendRow; - "sc-tooltip": ScTooltip; - "sc-tooltip-row": ScTooltipRow; - "sc-tooltip-rows": ScTooltipRows; - "sc-webgl-axis": ScWebglAxis; - "sc-webgl-bar-chart-dynamic-buffer": ScWebglBarChartDynamicBuffer; - "sc-webgl-bar-chart-dynamic-data": ScWebglBarChartDynamicData; - "sc-webgl-bar-chart-dynamic-data-streams": ScWebglBarChartDynamicDataStreams; - "sc-webgl-bar-chart-fast-viewport": ScWebglBarChartFastViewport; - "sc-webgl-bar-chart-margin": ScWebglBarChartMargin; - "sc-webgl-bar-chart-negative": ScWebglBarChartNegative; - "sc-webgl-bar-chart-positive-negative": ScWebglBarChartPositiveNegative; - "sc-webgl-bar-chart-standard": ScWebglBarChartStandard; - "sc-webgl-bar-chart-start-from-zero": ScWebglBarChartStartFromZero; - "sc-webgl-bar-chart-threshold-coloration": ScWebglBarChartThresholdColoration; - "sc-webgl-bar-chart-threshold-coloration-band": ScWebglBarChartThresholdColorationBand; - "sc-webgl-bar-chart-threshold-coloration-exact-point": ScWebglBarChartThresholdColorationExactPoint; - "sc-webgl-bar-chart-threshold-coloration-multiple-data-stream": ScWebglBarChartThresholdColorationMultipleDataStream; - "sc-webgl-bar-chart-threshold-coloration-multiple-thresholds": ScWebglBarChartThresholdColorationMultipleThresholds; - "sc-webgl-bar-chart-threshold-no-coloration": ScWebglBarChartThresholdNoColoration; - "sc-webgl-bar-chart-unsupported-data-types": ScWebglBarChartUnsupportedDataTypes; - "sc-webgl-base-chart": ScWebglBaseChart; - "sc-webgl-chart-annotation-editable": ScWebglChartAnnotationEditable; - "sc-webgl-chart-annotations": ScWebglChartAnnotations; - "sc-webgl-chart-annotations-always-in-viewport": ScWebglChartAnnotationsAlwaysInViewport; - "sc-webgl-chart-axis": ScWebglChartAxis; - "sc-webgl-chart-dynamic-charts": ScWebglChartDynamicCharts; - "sc-webgl-chart-large-viewport": ScWebglChartLargeViewport; - "sc-webgl-chart-multi": ScWebglChartMulti; - "sc-webgl-chart-no-annotations": ScWebglChartNoAnnotations; - "sc-webgl-chart-standard": ScWebglChartStandard; - "sc-webgl-chart-standard-with-legend": ScWebglChartStandardWithLegend; - "sc-webgl-chart-standard-with-legend-on-right": ScWebglChartStandardWithLegendOnRight; - "sc-webgl-chart-threshold-coloration-band": ScWebglChartThresholdColorationBand; - "sc-webgl-chart-threshold-coloration-exact-point": ScWebglChartThresholdColorationExactPoint; - "sc-webgl-chart-threshold-coloration-multiple-data-stream": ScWebglChartThresholdColorationMultipleDataStream; - "sc-webgl-chart-threshold-coloration-multiple-thresholds": ScWebglChartThresholdColorationMultipleThresholds; - "sc-webgl-chart-threshold-coloration-split-half": ScWebglChartThresholdColorationSplitHalf; - "sc-webgl-chart-tooltip-with-multiple-data-streams": ScWebglChartTooltipWithMultipleDataStreams; - "sc-webgl-context": ScWebglContext; - "sc-webgl-context-nested": ScWebglContextNested; - "sc-webgl-context-root": ScWebglContextRoot; - "sc-webgl-line-chart-dynamic-buffer": ScWebglLineChartDynamicBuffer; - "sc-webgl-line-chart-dynamic-data": ScWebglLineChartDynamicData; - "sc-webgl-line-chart-dynamic-data-streams": ScWebglLineChartDynamicDataStreams; "single-colored-status": SingleColoredStatus; "single-status": SingleStatus; "status-timeline-dynamic-buffer": StatusTimelineDynamicBuffer; @@ -1875,98 +1875,98 @@ export { LocalJSX as JSX }; declare module "@stencil/core" { export namespace JSX { interface IntrinsicElements { + "iot-app-kit-vis-angled-line-segment": LocalJSX.IotAppKitVisAngledLineSegment & JSXBase.HTMLAttributes; + "iot-app-kit-vis-annotations-draggable-multi": LocalJSX.IotAppKitVisAnnotationsDraggableMulti & JSXBase.HTMLAttributes; + "iot-app-kit-vis-app": LocalJSX.IotAppKitVisApp & JSXBase.HTMLAttributes; + "iot-app-kit-vis-bar-chart": LocalJSX.IotAppKitVisBarChart & JSXBase.HTMLAttributes; + "iot-app-kit-vis-box": LocalJSX.IotAppKitVisBox & JSXBase.HTMLAttributes; + "iot-app-kit-vis-chart-icon": LocalJSX.IotAppKitVisChartIcon & JSXBase.HTMLAttributes; + "iot-app-kit-vis-chart-y-range": LocalJSX.IotAppKitVisChartYRange & JSXBase.HTMLAttributes; + "iot-app-kit-vis-circle-point-shaders": LocalJSX.IotAppKitVisCirclePointShaders & JSXBase.HTMLAttributes; + "iot-app-kit-vis-data-stream-name": LocalJSX.IotAppKitVisDataStreamName & JSXBase.HTMLAttributes; + "iot-app-kit-vis-error-badge": LocalJSX.IotAppKitVisErrorBadge & JSXBase.HTMLAttributes; + "iot-app-kit-vis-expandable-input": LocalJSX.IotAppKitVisExpandableInput & JSXBase.HTMLAttributes; + "iot-app-kit-vis-expandable-input-standard": LocalJSX.IotAppKitVisExpandableInputStandard & JSXBase.HTMLAttributes; + "iot-app-kit-vis-gesture-handler": LocalJSX.IotAppKitVisGestureHandler & JSXBase.HTMLAttributes; + "iot-app-kit-vis-legend": LocalJSX.IotAppKitVisLegend & JSXBase.HTMLAttributes; + "iot-app-kit-vis-legend-row": LocalJSX.IotAppKitVisLegendRow & JSXBase.HTMLAttributes; + "iot-app-kit-vis-line-chart": LocalJSX.IotAppKitVisLineChart & JSXBase.HTMLAttributes; + "iot-app-kit-vis-line-chart-colored-point": LocalJSX.IotAppKitVisLineChartColoredPoint & JSXBase.HTMLAttributes; + "iot-app-kit-vis-line-chart-stream-data": LocalJSX.IotAppKitVisLineChartStreamData & JSXBase.HTMLAttributes; + "iot-app-kit-vis-loading-spinner": LocalJSX.IotAppKitVisLoadingSpinner & JSXBase.HTMLAttributes; + "iot-app-kit-vis-multiple-bars": LocalJSX.IotAppKitVisMultipleBars & JSXBase.HTMLAttributes; + "iot-app-kit-vis-multiple-lines": LocalJSX.IotAppKitVisMultipleLines & JSXBase.HTMLAttributes; + "iot-app-kit-vis-multiple-lines-overlapping": LocalJSX.IotAppKitVisMultipleLinesOverlapping & JSXBase.HTMLAttributes; + "iot-app-kit-vis-scatter-chart": LocalJSX.IotAppKitVisScatterChart & JSXBase.HTMLAttributes; + "iot-app-kit-vis-scatter-chart-dynamic-data": LocalJSX.IotAppKitVisScatterChartDynamicData & JSXBase.HTMLAttributes; + "iot-app-kit-vis-scatter-chart-threshold": LocalJSX.IotAppKitVisScatterChartThreshold & JSXBase.HTMLAttributes; + "iot-app-kit-vis-scatter-chart-threshold-coloration-band": LocalJSX.IotAppKitVisScatterChartThresholdColorationBand & JSXBase.HTMLAttributes; + "iot-app-kit-vis-scatter-chart-threshold-coloration-exact-point": LocalJSX.IotAppKitVisScatterChartThresholdColorationExactPoint & JSXBase.HTMLAttributes; + "iot-app-kit-vis-scatter-chart-threshold-coloration-multiple-data-stream": LocalJSX.IotAppKitVisScatterChartThresholdColorationMultipleDataStream & JSXBase.HTMLAttributes; + "iot-app-kit-vis-scatter-chart-threshold-coloration-multiple-thresholds": LocalJSX.IotAppKitVisScatterChartThresholdColorationMultipleThresholds & JSXBase.HTMLAttributes; + "iot-app-kit-vis-scatter-chart-threshold-no-coloration": LocalJSX.IotAppKitVisScatterChartThresholdNoColoration & JSXBase.HTMLAttributes; + "iot-app-kit-vis-scatter-chart-tooltip-with-multiple-data-streams-and-trends": LocalJSX.IotAppKitVisScatterChartTooltipWithMultipleDataStreamsAndTrends & JSXBase.HTMLAttributes; + "iot-app-kit-vis-scatter-chart-trend-line-color-configuration": LocalJSX.IotAppKitVisScatterChartTrendLineColorConfiguration & JSXBase.HTMLAttributes; + "iot-app-kit-vis-scatter-chart-trend-line-with-legend": LocalJSX.IotAppKitVisScatterChartTrendLineWithLegend & JSXBase.HTMLAttributes; + "iot-app-kit-vis-scatter-chart-unsupported-data-types": LocalJSX.IotAppKitVisScatterChartUnsupportedDataTypes & JSXBase.HTMLAttributes; + "iot-app-kit-vis-single-bar": LocalJSX.IotAppKitVisSingleBar & JSXBase.HTMLAttributes; + "iot-app-kit-vis-single-colored-bar": LocalJSX.IotAppKitVisSingleColoredBar & JSXBase.HTMLAttributes; + "iot-app-kit-vis-size-provider": LocalJSX.IotAppKitVisSizeProvider & JSXBase.HTMLAttributes; + "iot-app-kit-vis-size-provider-standard": LocalJSX.IotAppKitVisSizeProviderStandard & JSXBase.HTMLAttributes; + "iot-app-kit-vis-status-timeline": LocalJSX.IotAppKitVisStatusTimeline & JSXBase.HTMLAttributes; + "iot-app-kit-vis-status-timeline-overlay": LocalJSX.IotAppKitVisStatusTimelineOverlay & JSXBase.HTMLAttributes; + "iot-app-kit-vis-status-timeline-overlay-row": LocalJSX.IotAppKitVisStatusTimelineOverlayRow & JSXBase.HTMLAttributes; + "iot-app-kit-vis-straight-line-segment": LocalJSX.IotAppKitVisStraightLineSegment & JSXBase.HTMLAttributes; + "iot-app-kit-vis-straight-line-segment-colored": LocalJSX.IotAppKitVisStraightLineSegmentColored & JSXBase.HTMLAttributes; + "iot-app-kit-vis-threshold-legend": LocalJSX.IotAppKitVisThresholdLegend & JSXBase.HTMLAttributes; + "iot-app-kit-vis-threshold-legend-row": LocalJSX.IotAppKitVisThresholdLegendRow & JSXBase.HTMLAttributes; + "iot-app-kit-vis-tooltip": LocalJSX.IotAppKitVisTooltip & JSXBase.HTMLAttributes; + "iot-app-kit-vis-tooltip-row": LocalJSX.IotAppKitVisTooltipRow & JSXBase.HTMLAttributes; + "iot-app-kit-vis-tooltip-rows": LocalJSX.IotAppKitVisTooltipRows & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-axis": LocalJSX.IotAppKitVisWebglAxis & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-bar-chart-dynamic-buffer": LocalJSX.IotAppKitVisWebglBarChartDynamicBuffer & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-bar-chart-dynamic-data": LocalJSX.IotAppKitVisWebglBarChartDynamicData & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-bar-chart-dynamic-data-streams": LocalJSX.IotAppKitVisWebglBarChartDynamicDataStreams & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-bar-chart-fast-viewport": LocalJSX.IotAppKitVisWebglBarChartFastViewport & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-bar-chart-margin": LocalJSX.IotAppKitVisWebglBarChartMargin & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-bar-chart-negative": LocalJSX.IotAppKitVisWebglBarChartNegative & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-bar-chart-positive-negative": LocalJSX.IotAppKitVisWebglBarChartPositiveNegative & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-bar-chart-standard": LocalJSX.IotAppKitVisWebglBarChartStandard & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-bar-chart-start-from-zero": LocalJSX.IotAppKitVisWebglBarChartStartFromZero & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-bar-chart-threshold-coloration": LocalJSX.IotAppKitVisWebglBarChartThresholdColoration & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-bar-chart-threshold-coloration-band": LocalJSX.IotAppKitVisWebglBarChartThresholdColorationBand & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-bar-chart-threshold-coloration-exact-point": LocalJSX.IotAppKitVisWebglBarChartThresholdColorationExactPoint & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-bar-chart-threshold-coloration-multiple-data-stream": LocalJSX.IotAppKitVisWebglBarChartThresholdColorationMultipleDataStream & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-bar-chart-threshold-coloration-multiple-thresholds": LocalJSX.IotAppKitVisWebglBarChartThresholdColorationMultipleThresholds & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-bar-chart-threshold-no-coloration": LocalJSX.IotAppKitVisWebglBarChartThresholdNoColoration & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-bar-chart-unsupported-data-types": LocalJSX.IotAppKitVisWebglBarChartUnsupportedDataTypes & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-base-chart": LocalJSX.IotAppKitVisWebglBaseChart & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-annotation-editable": LocalJSX.IotAppKitVisWebglChartAnnotationEditable & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-annotations": LocalJSX.IotAppKitVisWebglChartAnnotations & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-annotations-always-in-viewport": LocalJSX.IotAppKitVisWebglChartAnnotationsAlwaysInViewport & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-axis": LocalJSX.IotAppKitVisWebglChartAxis & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-dynamic-charts": LocalJSX.IotAppKitVisWebglChartDynamicCharts & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-large-viewport": LocalJSX.IotAppKitVisWebglChartLargeViewport & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-multi": LocalJSX.IotAppKitVisWebglChartMulti & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-no-annotations": LocalJSX.IotAppKitVisWebglChartNoAnnotations & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-standard": LocalJSX.IotAppKitVisWebglChartStandard & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-standard-with-legend": LocalJSX.IotAppKitVisWebglChartStandardWithLegend & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-standard-with-legend-on-right": LocalJSX.IotAppKitVisWebglChartStandardWithLegendOnRight & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-threshold-coloration-band": LocalJSX.IotAppKitVisWebglChartThresholdColorationBand & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-threshold-coloration-exact-point": LocalJSX.IotAppKitVisWebglChartThresholdColorationExactPoint & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-threshold-coloration-multiple-data-stream": LocalJSX.IotAppKitVisWebglChartThresholdColorationMultipleDataStream & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-threshold-coloration-multiple-thresholds": LocalJSX.IotAppKitVisWebglChartThresholdColorationMultipleThresholds & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-threshold-coloration-split-half": LocalJSX.IotAppKitVisWebglChartThresholdColorationSplitHalf & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-chart-tooltip-with-multiple-data-streams": LocalJSX.IotAppKitVisWebglChartTooltipWithMultipleDataStreams & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-context": LocalJSX.IotAppKitVisWebglContext & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-context-nested": LocalJSX.IotAppKitVisWebglContextNested & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-context-root": LocalJSX.IotAppKitVisWebglContextRoot & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-line-chart-dynamic-buffer": LocalJSX.IotAppKitVisWebglLineChartDynamicBuffer & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-line-chart-dynamic-data": LocalJSX.IotAppKitVisWebglLineChartDynamicData & JSXBase.HTMLAttributes; + "iot-app-kit-vis-webgl-line-chart-dynamic-data-streams": LocalJSX.IotAppKitVisWebglLineChartDynamicDataStreams & JSXBase.HTMLAttributes; "line-chart-unsupported-data-types": LocalJSX.LineChartUnsupportedDataTypes & JSXBase.HTMLAttributes; "line-chart-viewport-change": LocalJSX.LineChartViewportChange & JSXBase.HTMLAttributes; "multiple-statuses": LocalJSX.MultipleStatuses & JSXBase.HTMLAttributes; - "sc-angled-line-segment": LocalJSX.ScAngledLineSegment & JSXBase.HTMLAttributes; - "sc-annotations-draggable-multi": LocalJSX.ScAnnotationsDraggableMulti & JSXBase.HTMLAttributes; - "sc-app": LocalJSX.ScApp & JSXBase.HTMLAttributes; - "sc-bar-chart": LocalJSX.ScBarChart & JSXBase.HTMLAttributes; - "sc-box": LocalJSX.ScBox & JSXBase.HTMLAttributes; - "sc-chart-icon": LocalJSX.ScChartIcon & JSXBase.HTMLAttributes; - "sc-chart-y-range": LocalJSX.ScChartYRange & JSXBase.HTMLAttributes; - "sc-circle-point-shaders": LocalJSX.ScCirclePointShaders & JSXBase.HTMLAttributes; - "sc-data-stream-name": LocalJSX.ScDataStreamName & JSXBase.HTMLAttributes; - "sc-error-badge": LocalJSX.ScErrorBadge & JSXBase.HTMLAttributes; - "sc-expandable-input": LocalJSX.ScExpandableInput & JSXBase.HTMLAttributes; - "sc-expandable-input-standard": LocalJSX.ScExpandableInputStandard & JSXBase.HTMLAttributes; - "sc-gesture-handler": LocalJSX.ScGestureHandler & JSXBase.HTMLAttributes; - "sc-legend": LocalJSX.ScLegend & JSXBase.HTMLAttributes; - "sc-legend-row": LocalJSX.ScLegendRow & JSXBase.HTMLAttributes; - "sc-line-chart": LocalJSX.ScLineChart & JSXBase.HTMLAttributes; - "sc-line-chart-colored-point": LocalJSX.ScLineChartColoredPoint & JSXBase.HTMLAttributes; - "sc-line-chart-stream-data": LocalJSX.ScLineChartStreamData & JSXBase.HTMLAttributes; - "sc-loading-spinner": LocalJSX.ScLoadingSpinner & JSXBase.HTMLAttributes; - "sc-multiple-bars": LocalJSX.ScMultipleBars & JSXBase.HTMLAttributes; - "sc-multiple-lines": LocalJSX.ScMultipleLines & JSXBase.HTMLAttributes; - "sc-multiple-lines-overlapping": LocalJSX.ScMultipleLinesOverlapping & JSXBase.HTMLAttributes; - "sc-scatter-chart": LocalJSX.ScScatterChart & JSXBase.HTMLAttributes; - "sc-scatter-chart-dynamic-data": LocalJSX.ScScatterChartDynamicData & JSXBase.HTMLAttributes; - "sc-scatter-chart-threshold": LocalJSX.ScScatterChartThreshold & JSXBase.HTMLAttributes; - "sc-scatter-chart-threshold-coloration-band": LocalJSX.ScScatterChartThresholdColorationBand & JSXBase.HTMLAttributes; - "sc-scatter-chart-threshold-coloration-exact-point": LocalJSX.ScScatterChartThresholdColorationExactPoint & JSXBase.HTMLAttributes; - "sc-scatter-chart-threshold-coloration-multiple-data-stream": LocalJSX.ScScatterChartThresholdColorationMultipleDataStream & JSXBase.HTMLAttributes; - "sc-scatter-chart-threshold-coloration-multiple-thresholds": LocalJSX.ScScatterChartThresholdColorationMultipleThresholds & JSXBase.HTMLAttributes; - "sc-scatter-chart-threshold-no-coloration": LocalJSX.ScScatterChartThresholdNoColoration & JSXBase.HTMLAttributes; - "sc-scatter-chart-tooltip-with-multiple-data-streams-and-trends": LocalJSX.ScScatterChartTooltipWithMultipleDataStreamsAndTrends & JSXBase.HTMLAttributes; - "sc-scatter-chart-trend-line-color-configuration": LocalJSX.ScScatterChartTrendLineColorConfiguration & JSXBase.HTMLAttributes; - "sc-scatter-chart-trend-line-with-legend": LocalJSX.ScScatterChartTrendLineWithLegend & JSXBase.HTMLAttributes; - "sc-scatter-chart-unsupported-data-types": LocalJSX.ScScatterChartUnsupportedDataTypes & JSXBase.HTMLAttributes; - "sc-single-bar": LocalJSX.ScSingleBar & JSXBase.HTMLAttributes; - "sc-single-colored-bar": LocalJSX.ScSingleColoredBar & JSXBase.HTMLAttributes; - "sc-size-provider": LocalJSX.ScSizeProvider & JSXBase.HTMLAttributes; - "sc-size-provider-standard": LocalJSX.ScSizeProviderStandard & JSXBase.HTMLAttributes; - "sc-status-timeline": LocalJSX.ScStatusTimeline & JSXBase.HTMLAttributes; - "sc-status-timeline-overlay": LocalJSX.ScStatusTimelineOverlay & JSXBase.HTMLAttributes; - "sc-status-timeline-overlay-row": LocalJSX.ScStatusTimelineOverlayRow & JSXBase.HTMLAttributes; - "sc-straight-line-segment": LocalJSX.ScStraightLineSegment & JSXBase.HTMLAttributes; - "sc-straight-line-segment-colored": LocalJSX.ScStraightLineSegmentColored & JSXBase.HTMLAttributes; - "sc-threshold-legend": LocalJSX.ScThresholdLegend & JSXBase.HTMLAttributes; - "sc-threshold-legend-row": LocalJSX.ScThresholdLegendRow & JSXBase.HTMLAttributes; - "sc-tooltip": LocalJSX.ScTooltip & JSXBase.HTMLAttributes; - "sc-tooltip-row": LocalJSX.ScTooltipRow & JSXBase.HTMLAttributes; - "sc-tooltip-rows": LocalJSX.ScTooltipRows & JSXBase.HTMLAttributes; - "sc-webgl-axis": LocalJSX.ScWebglAxis & JSXBase.HTMLAttributes; - "sc-webgl-bar-chart-dynamic-buffer": LocalJSX.ScWebglBarChartDynamicBuffer & JSXBase.HTMLAttributes; - "sc-webgl-bar-chart-dynamic-data": LocalJSX.ScWebglBarChartDynamicData & JSXBase.HTMLAttributes; - "sc-webgl-bar-chart-dynamic-data-streams": LocalJSX.ScWebglBarChartDynamicDataStreams & JSXBase.HTMLAttributes; - "sc-webgl-bar-chart-fast-viewport": LocalJSX.ScWebglBarChartFastViewport & JSXBase.HTMLAttributes; - "sc-webgl-bar-chart-margin": LocalJSX.ScWebglBarChartMargin & JSXBase.HTMLAttributes; - "sc-webgl-bar-chart-negative": LocalJSX.ScWebglBarChartNegative & JSXBase.HTMLAttributes; - "sc-webgl-bar-chart-positive-negative": LocalJSX.ScWebglBarChartPositiveNegative & JSXBase.HTMLAttributes; - "sc-webgl-bar-chart-standard": LocalJSX.ScWebglBarChartStandard & JSXBase.HTMLAttributes; - "sc-webgl-bar-chart-start-from-zero": LocalJSX.ScWebglBarChartStartFromZero & JSXBase.HTMLAttributes; - "sc-webgl-bar-chart-threshold-coloration": LocalJSX.ScWebglBarChartThresholdColoration & JSXBase.HTMLAttributes; - "sc-webgl-bar-chart-threshold-coloration-band": LocalJSX.ScWebglBarChartThresholdColorationBand & JSXBase.HTMLAttributes; - "sc-webgl-bar-chart-threshold-coloration-exact-point": LocalJSX.ScWebglBarChartThresholdColorationExactPoint & JSXBase.HTMLAttributes; - "sc-webgl-bar-chart-threshold-coloration-multiple-data-stream": LocalJSX.ScWebglBarChartThresholdColorationMultipleDataStream & JSXBase.HTMLAttributes; - "sc-webgl-bar-chart-threshold-coloration-multiple-thresholds": LocalJSX.ScWebglBarChartThresholdColorationMultipleThresholds & JSXBase.HTMLAttributes; - "sc-webgl-bar-chart-threshold-no-coloration": LocalJSX.ScWebglBarChartThresholdNoColoration & JSXBase.HTMLAttributes; - "sc-webgl-bar-chart-unsupported-data-types": LocalJSX.ScWebglBarChartUnsupportedDataTypes & JSXBase.HTMLAttributes; - "sc-webgl-base-chart": LocalJSX.ScWebglBaseChart & JSXBase.HTMLAttributes; - "sc-webgl-chart-annotation-editable": LocalJSX.ScWebglChartAnnotationEditable & JSXBase.HTMLAttributes; - "sc-webgl-chart-annotations": LocalJSX.ScWebglChartAnnotations & JSXBase.HTMLAttributes; - "sc-webgl-chart-annotations-always-in-viewport": LocalJSX.ScWebglChartAnnotationsAlwaysInViewport & JSXBase.HTMLAttributes; - "sc-webgl-chart-axis": LocalJSX.ScWebglChartAxis & JSXBase.HTMLAttributes; - "sc-webgl-chart-dynamic-charts": LocalJSX.ScWebglChartDynamicCharts & JSXBase.HTMLAttributes; - "sc-webgl-chart-large-viewport": LocalJSX.ScWebglChartLargeViewport & JSXBase.HTMLAttributes; - "sc-webgl-chart-multi": LocalJSX.ScWebglChartMulti & JSXBase.HTMLAttributes; - "sc-webgl-chart-no-annotations": LocalJSX.ScWebglChartNoAnnotations & JSXBase.HTMLAttributes; - "sc-webgl-chart-standard": LocalJSX.ScWebglChartStandard & JSXBase.HTMLAttributes; - "sc-webgl-chart-standard-with-legend": LocalJSX.ScWebglChartStandardWithLegend & JSXBase.HTMLAttributes; - "sc-webgl-chart-standard-with-legend-on-right": LocalJSX.ScWebglChartStandardWithLegendOnRight & JSXBase.HTMLAttributes; - "sc-webgl-chart-threshold-coloration-band": LocalJSX.ScWebglChartThresholdColorationBand & JSXBase.HTMLAttributes; - "sc-webgl-chart-threshold-coloration-exact-point": LocalJSX.ScWebglChartThresholdColorationExactPoint & JSXBase.HTMLAttributes; - "sc-webgl-chart-threshold-coloration-multiple-data-stream": LocalJSX.ScWebglChartThresholdColorationMultipleDataStream & JSXBase.HTMLAttributes; - "sc-webgl-chart-threshold-coloration-multiple-thresholds": LocalJSX.ScWebglChartThresholdColorationMultipleThresholds & JSXBase.HTMLAttributes; - "sc-webgl-chart-threshold-coloration-split-half": LocalJSX.ScWebglChartThresholdColorationSplitHalf & JSXBase.HTMLAttributes; - "sc-webgl-chart-tooltip-with-multiple-data-streams": LocalJSX.ScWebglChartTooltipWithMultipleDataStreams & JSXBase.HTMLAttributes; - "sc-webgl-context": LocalJSX.ScWebglContext & JSXBase.HTMLAttributes; - "sc-webgl-context-nested": LocalJSX.ScWebglContextNested & JSXBase.HTMLAttributes; - "sc-webgl-context-root": LocalJSX.ScWebglContextRoot & JSXBase.HTMLAttributes; - "sc-webgl-line-chart-dynamic-buffer": LocalJSX.ScWebglLineChartDynamicBuffer & JSXBase.HTMLAttributes; - "sc-webgl-line-chart-dynamic-data": LocalJSX.ScWebglLineChartDynamicData & JSXBase.HTMLAttributes; - "sc-webgl-line-chart-dynamic-data-streams": LocalJSX.ScWebglLineChartDynamicDataStreams & JSXBase.HTMLAttributes; "single-colored-status": LocalJSX.SingleColoredStatus & JSXBase.HTMLAttributes; "single-status": LocalJSX.SingleStatus & JSXBase.HTMLAttributes; "status-timeline-dynamic-buffer": LocalJSX.StatusTimelineDynamicBuffer & JSXBase.HTMLAttributes; diff --git a/packages/iot-app-kit-visualizations/src/components/charts/chart-icon/sc-chart-icon.spec.tsx b/packages/iot-app-kit-visualizations/src/components/charts/chart-icon/sc-chart-icon.spec.tsx index d8ef31716..704320425 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/chart-icon/sc-chart-icon.spec.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/chart-icon/sc-chart-icon.spec.tsx @@ -6,15 +6,17 @@ import { CustomHTMLElement } from '../../../utils/types'; import { update } from '../common/tests/merge'; import { StatusIcon } from '../common/constants'; -const newChartIconSpecPage = async (props: Partial) => { +const newChartIconSpecPage = async (props: Partial) => { const page = await newSpecPage({ components: [ScChartIcon], html: '
', supportsShadowDom: false, }); - const chartIcon = page.doc.createElement('sc-chart-icon') as CustomHTMLElement; - const defaultProps: Components.ScChartIcon = { + const chartIcon = page.doc.createElement('iot-app-kit-vis-chart-icon') as CustomHTMLElement< + Components.IotAppKitVisChartIcon + >; + const defaultProps: Components.IotAppKitVisChartIcon = { name: StatusIcon.NORMAL, }; diff --git a/packages/iot-app-kit-visualizations/src/components/charts/chart-icon/sc-chart-icon.tsx b/packages/iot-app-kit-visualizations/src/components/charts/chart-icon/sc-chart-icon.tsx index d2c836088..48f954794 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/chart-icon/sc-chart-icon.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/chart-icon/sc-chart-icon.tsx @@ -3,7 +3,7 @@ import { getIcons } from '../common/annotations/iconUtils'; import { StatusIcon } from '../common/constants'; @Component({ - tag: 'sc-chart-icon', + tag: 'iot-app-kit-vis-chart-icon', styleUrl: 'sc-chart-icon.css', shadow: false, }) diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-bar-chart/sc-bar-chart.spec.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-bar-chart/sc-bar-chart.spec.tsx index c27d150bb..34478508c 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-bar-chart/sc-bar-chart.spec.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-bar-chart/sc-bar-chart.spec.tsx @@ -6,8 +6,8 @@ import 'webgl-mock-threejs'; import { newChartSpecPage } from '../../../testing/chartDescriptions/newChartSpecPage'; import { describeChart } from '../../../testing/chartDescriptions/describeChart'; -const barChart = newChartSpecPage('sc-bar-chart'); +const barChart = newChartSpecPage('iot-app-kit-vis-bar-chart'); -describe('sc-bar-chart', () => { +describe('iot-app-kit-vis-bar-chart', () => { describeChart(barChart); }); diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-bar-chart/sc-bar-chart.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-bar-chart/sc-bar-chart.tsx index 9d97e221f..63e7bf99b 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-bar-chart/sc-bar-chart.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-bar-chart/sc-bar-chart.tsx @@ -32,10 +32,15 @@ const DEFAULT_MIN_BUFFER_SIZE = 1000; const DEFAULT_BUFFER_FACTOR = 2; const tooltip = (props: Tooltip.Props) => ( - + ); @Component({ - tag: 'sc-bar-chart', + tag: 'iot-app-kit-vis-bar-chart', shadow: false, }) export class ScBarChart implements ChartConfig { @@ -67,10 +72,10 @@ export class ScBarChart implements ChartConfig { render() { return ( - ( - {}; const CURRENT_VALUE_SELECTOR = "[data-testid='current-value']"; const COLOR_BAR_SELECTOR = '.bar'; -const newLegendRowSpecPage = async (props: Partial) => { +const newLegendRowSpecPage = async (props: Partial) => { const page = await newSpecPage({ components: [ScLegendRow], html: '
', supportsShadowDom: false, }); - const legendRow = page.doc.createElement('sc-legend-row') as CustomHTMLElement; - const defaultProps: Components.ScLegendRow = { + const legendRow = page.doc.createElement('iot-app-kit-vis-legend-row') as CustomHTMLElement< + Components.IotAppKitVisLegendRow + >; + const defaultProps: Components.IotAppKitVisLegendRow = { isLoading: false, updateDataStreamName: noop, isEditing: false, @@ -61,7 +63,7 @@ it('displays icon when passed in', async () => { icon: StatusIcon.NORMAL, }); - expect(dataStreamInfo.innerHTML).toInclude('sc-chart-icon'); + expect(dataStreamInfo.innerHTML).toInclude('iot-app-kit-vis-chart-icon'); }); it('displays unit when provided', async () => { @@ -100,7 +102,7 @@ describe('loading status', () => { const { dataStreamInfo } = await newLegendRowSpecPage({ isLoading: true, }); - const loadingSpinners = dataStreamInfo.querySelector('sc-loading-spinner'); + const loadingSpinners = dataStreamInfo.querySelector('iot-app-kit-vis-loading-spinner'); expect(loadingSpinners).not.toBeNull(); }); @@ -108,7 +110,7 @@ describe('loading status', () => { const { dataStreamInfo } = await newLegendRowSpecPage({ isLoading: false, }); - const loadingSpinners = dataStreamInfo.querySelector('sc-loading-spinner'); + const loadingSpinners = dataStreamInfo.querySelector('iot-app-kit-vis-loading-spinner'); expect(loadingSpinners).toBeNull(); }); }); diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-legend/sc-legend-row/sc-legend-row.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-legend/sc-legend-row/sc-legend-row.tsx index 1d690296b..5301c3a59 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-legend/sc-legend-row/sc-legend-row.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-legend/sc-legend-row/sc-legend-row.tsx @@ -22,7 +22,7 @@ const VIEW_MODE_STYLE: StencilCSSProperty = { }; @Component({ - tag: 'sc-legend-row', + tag: 'iot-app-kit-vis-legend-row', styleUrl: 'sc-legend-row.css', shadow: false, }) @@ -58,7 +58,7 @@ export class ScLegendRow {
{this.isLoading ? ( ) : ( @@ -75,7 +75,7 @@ export class ScLegendRow { )}
-
- {this.icon && } + {this.icon && }

diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-legend/sc-legend.css b/packages/iot-app-kit-visualizations/src/components/charts/sc-legend/sc-legend.css index 282582e4f..6657dc682 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-legend/sc-legend.css +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-legend/sc-legend.css @@ -1,4 +1,4 @@ -sc-legend .legend-container { +iot-app-kit-vis-legend .legend-container { display: flex; flex-wrap: wrap; font-size: var(--font-size-1); @@ -13,6 +13,6 @@ sc-legend .legend-container { } /* Hide scrollbar for Chrome, Safari and Opera */ -sc-legend .legend-container::-webkit-scrollbar { +iot-app-kit-vis-legend .legend-container::-webkit-scrollbar { display: none; } diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-legend/sc-legend.spec.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-legend/sc-legend.spec.tsx index 1e9b4ab78..e43af19bb 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-legend/sc-legend.spec.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-legend/sc-legend.spec.tsx @@ -116,15 +116,15 @@ const STRING_STREAM_2: DataStream = { dataType: DataType.STRING, }; -const newChartLegendSpecPage = async (props: Partial) => { +const newChartLegendSpecPage = async (props: Partial) => { const page = await newSpecPage({ components: [ScLegend, ScLegendRow], html: '
', supportsShadowDom: false, }); - const legend = page.doc.createElement('sc-legend') as CustomHTMLElement; + const legend = page.doc.createElement('iot-app-kit-vis-legend') as CustomHTMLElement; - const defaultProps: Components.ScLegend = { + const defaultProps: Components.IotAppKitVisLegend = { updateDataStreamName: noop, isLoading: false, isEditing: false, @@ -158,7 +158,7 @@ it('creates empty legend if no data streams are passed in', async () => { const { legend } = await newChartLegendSpecPage({ dataStreams: [], }); - expect(legend.querySelectorAll('sc-legend-row')).toBeEmpty(); + expect(legend.querySelectorAll('iot-app-kit-vis-legend-row')).toBeEmpty(); }); it('displays data point on legend when it falls before the viewport', async () => { @@ -175,7 +175,7 @@ it('displays data point on legend when it falls before the viewport', async () = ], }); - const row = legend.querySelector('sc-legend-row') as HTMLScLegendRowElement; + const row = legend.querySelector('iot-app-kit-vis-legend-row') as HTMLIotAppKitVisLegendRowElement; expect(row).not.toBeNull(); expect(row.point).toEqual(POINT); }); @@ -198,7 +198,7 @@ describe('loading status', () => { isLoading: true, }); - expect(legend.querySelector('sc-loading-spinner')).not.toBeNull(); + expect(legend.querySelector('iot-app-kit-vis-loading-spinner')).not.toBeNull(); }); it('legend row is not loading when legend is not loading', async () => { @@ -207,7 +207,7 @@ describe('loading status', () => { isLoading: false, }); - expect(legend.querySelector('sc-loading-spinner')).toBeNull(); + expect(legend.querySelector('iot-app-kit-vis-loading-spinner')).toBeNull(); }); }); @@ -219,8 +219,8 @@ describe('indicates breaching of thresholds', () => { thresholds: [ALARM_THRESHOLD], }); - expect(legend.querySelectorAll('sc-legend-row')).toHaveLength(1); - const row = legend.querySelector('sc-legend-row') as HTMLScLegendRowElement; + expect(legend.querySelectorAll('iot-app-kit-vis-legend-row')).toHaveLength(1); + const row = legend.querySelector('iot-app-kit-vis-legend-row') as HTMLIotAppKitVisLegendRowElement; expect(row.valueColor).toBe(ALARM_THRESHOLD.color); expect(row.icon).toBe(ALARM_THRESHOLD.icon); @@ -243,8 +243,8 @@ describe('indicates breaching of thresholds', () => { trendResults: [trendResult], }); - expect(legend.querySelectorAll('sc-legend-row')).toHaveLength(2); - const rows = legend.querySelectorAll('sc-legend-row'); + expect(legend.querySelectorAll('iot-app-kit-vis-legend-row')).toHaveLength(2); + const rows = legend.querySelectorAll('iot-app-kit-vis-legend-row'); const trendRow = rows[1]; // has a trend row which is shown as breaching @@ -258,8 +258,8 @@ describe('indicates breaching of thresholds', () => { thresholds: [ALARM_THRESHOLD], }); - expect(legend.querySelectorAll('sc-legend-row')).toHaveLength(1); - const row = legend.querySelector('sc-legend-row') as HTMLScLegendRowElement; + expect(legend.querySelectorAll('iot-app-kit-vis-legend-row')).toHaveLength(1); + const row = legend.querySelector('iot-app-kit-vis-legend-row') as HTMLIotAppKitVisLegendRowElement; expect(row.valueColor).not.toBe(ALARM_THRESHOLD.color); expect(row.icon).not.toBe(ALARM_THRESHOLD.icon); @@ -281,8 +281,8 @@ describe('indicates breaching of thresholds', () => { thresholds: [ALARM_THRESHOLD], }); - expect(legend.querySelectorAll('sc-legend-row')).toHaveLength(1); - const row = legend.querySelector('sc-legend-row') as HTMLScLegendRowElement; + expect(legend.querySelectorAll('iot-app-kit-vis-legend-row')).toHaveLength(1); + const row = legend.querySelector('iot-app-kit-vis-legend-row') as HTMLIotAppKitVisLegendRowElement; expect(row.valueColor).toBe(ALARM_THRESHOLD.color); expect(row.icon).toBe(ALARM_THRESHOLD.icon); @@ -304,7 +304,7 @@ describe('indicates breaching of thresholds', () => { ], thresholds: [{ ...THRESHOLD, dataStreamIds: ['some-fake-id-that-is-not-our-data-stream-id'] }], }); - const row = legend.querySelector('sc-legend-row') as HTMLScLegendRowElement; + const row = legend.querySelector('iot-app-kit-vis-legend-row') as HTMLIotAppKitVisLegendRowElement; expect(row.valueColor).not.toBe(THRESHOLD.color); }); @@ -324,7 +324,7 @@ describe('indicates breaching of thresholds', () => { ], thresholds: [{ ...THRESHOLD, dataStreamIds: ['some-fake-id-that-is-not-our-data-stream-id'] }], }); - const row = legend.querySelector('sc-legend-row') as HTMLScLegendRowElement; + const row = legend.querySelector('iot-app-kit-vis-legend-row') as HTMLIotAppKitVisLegendRowElement; expect(row.valueColor).not.toBe(THRESHOLD.color); }); @@ -345,7 +345,7 @@ describe('indicates breaching of thresholds', () => { ], thresholds: [THRESHOLD], }); - const row = legend.querySelector('sc-legend-row') as HTMLScLegendRowElement; + const row = legend.querySelector('iot-app-kit-vis-legend-row') as HTMLIotAppKitVisLegendRowElement; expect(row.valueColor).not.toBe(THRESHOLD.color); }); @@ -366,7 +366,7 @@ describe('indicates breaching of thresholds', () => { ], thresholds: [THRESHOLD], }); - const row = legend.querySelector('sc-legend-row') as HTMLScLegendRowElement; + const row = legend.querySelector('iot-app-kit-vis-legend-row') as HTMLIotAppKitVisLegendRowElement; expect(row.valueColor).toBe(THRESHOLD.color); }); @@ -386,7 +386,7 @@ describe('indicates breaching of thresholds', () => { ], thresholds: [], }); - const row = legend.querySelector('sc-legend-row') as HTMLScLegendRowElement; + const row = legend.querySelector('iot-app-kit-vis-legend-row') as HTMLIotAppKitVisLegendRowElement; expect(row.valueColor).toBe(DEFAULT_LEGEND_TEXT_COLOR); }); @@ -406,7 +406,7 @@ describe('indicates breaching of thresholds', () => { ], thresholds: [THRESHOLD], }); - const row = legend.querySelector('sc-legend-row') as HTMLScLegendRowElement; + const row = legend.querySelector('iot-app-kit-vis-legend-row') as HTMLIotAppKitVisLegendRowElement; expect(row.valueColor).toBe(DEFAULT_LEGEND_TEXT_COLOR); }); @@ -438,7 +438,7 @@ describe('indicates breaching of thresholds', () => { ], thresholds: upperLowerThresholds, }); - const row = legend.querySelector('sc-legend-row') as HTMLScLegendRowElement; + const row = legend.querySelector('iot-app-kit-vis-legend-row') as HTMLIotAppKitVisLegendRowElement; expect(row.valueColor).toBe(LOWER_THRESHOLD.color); }); @@ -471,7 +471,7 @@ describe('indicates breaching of thresholds', () => { ], thresholds: upperLowerThresholds, }); - const row = legend.querySelector('sc-legend-row') as HTMLScLegendRowElement; + const row = legend.querySelector('iot-app-kit-vis-legend-row') as HTMLIotAppKitVisLegendRowElement; expect(row.valueColor).toBe(UPPER_THRESHOLD.color); }); @@ -484,7 +484,9 @@ describe('is editing', () => { isEditing: true, }); - const streamName = legend.querySelector('sc-data-stream-name') as HTMLScDataStreamNameElement; + const streamName = legend.querySelector( + 'iot-app-kit-vis-data-stream-name' + ) as HTMLIotAppKitVisDataStreamNameElement; expect(streamName).toHaveAttribute('isEditing'); }); @@ -494,7 +496,9 @@ describe('is editing', () => { isEditing: false, }); - const streamName = legend.querySelector('sc-data-stream-name') as HTMLScDataStreamNameElement; + const streamName = legend.querySelector( + 'iot-app-kit-vis-data-stream-name' + ) as HTMLIotAppKitVisDataStreamNameElement; expect(streamName).not.toHaveAttribute('isEditing'); }); @@ -504,7 +508,9 @@ describe('is editing', () => { isEditing: undefined, }); - const streamName = legend.querySelector('sc-data-stream-name') as HTMLScDataStreamNameElement; + const streamName = legend.querySelector( + 'iot-app-kit-vis-data-stream-name' + ) as HTMLIotAppKitVisDataStreamNameElement; expect(streamName).not.toHaveAttribute('isEditing'); }); }); @@ -515,7 +521,7 @@ describe('number of legend rows', () => { dataStreams: [DATA_STREAM], }); - expect(legend.querySelectorAll('sc-legend-row')).toHaveLength(1); + expect(legend.querySelectorAll('iot-app-kit-vis-legend-row')).toHaveLength(1); }); it('does not create a legend row when passed one trend result without a corresponding data stream', async () => { @@ -533,7 +539,7 @@ describe('number of legend rows', () => { ], }); - expect(legend.querySelectorAll('sc-legend-row')).toBeEmpty(); + expect(legend.querySelectorAll('iot-app-kit-vis-legend-row')).toBeEmpty(); }); it('creates two legend rows when passed one trend result with a corresponding data stream', async () => { @@ -552,7 +558,7 @@ describe('number of legend rows', () => { ], }); - expect(legend.querySelectorAll('sc-legend-row')).toHaveLength(2); + expect(legend.querySelectorAll('iot-app-kit-vis-legend-row')).toHaveLength(2); }); it('creates multiple legend rows when passed multiple data streams with corresponding legend rows', async () => { @@ -560,7 +566,7 @@ describe('number of legend rows', () => { dataStreams: [NUMBER_STREAM, { ...NUMBER_STREAM, id: 'some other id' }], }); - expect(legend.querySelectorAll('sc-legend-row')).toHaveLength(2); + expect(legend.querySelectorAll('iot-app-kit-vis-legend-row')).toHaveLength(2); }); it('creates multiple legend rows when passed multiple data streams with corresponding legend rows and trend results', async () => { @@ -603,7 +609,7 @@ describe('number of legend rows', () => { ], }); - expect(legend.querySelectorAll('sc-legend-row')).toHaveLength(4); + expect(legend.querySelectorAll('iot-app-kit-vis-legend-row')).toHaveLength(4); }); }); @@ -642,7 +648,7 @@ describe('active point passed into legend rows', () => { ], }); - const legendInfo = legend.querySelector('sc-legend-row') as HTMLScLegendRowElement; + const legendInfo = legend.querySelector('iot-app-kit-vis-legend-row') as HTMLIotAppKitVisLegendRowElement; expect(legendInfo.point).toEqual(POINT_2); }); @@ -693,7 +699,7 @@ describe('active point passed into legend rows', () => { ], }); - const legendInfo = legend.querySelectorAll('sc-legend-row')[1] as HTMLScLegendRowElement; + const legendInfo = legend.querySelectorAll('iot-app-kit-vis-legend-row')[1] as HTMLIotAppKitVisLegendRowElement; expect(legendInfo.point).toEqual({ x: POINT_2.x, y: 35.552, @@ -708,7 +714,7 @@ describe('string data type behavior', () => { supportString: true, }); - expect(legend.querySelectorAll('sc-legend-row')).toHaveLength(2); + expect(legend.querySelectorAll('iot-app-kit-vis-legend-row')).toHaveLength(2); }); it('does not render a stream info per string data stream when it does not supports strings', async () => { @@ -717,7 +723,7 @@ describe('string data type behavior', () => { supportString: false, }); - expect(legend.querySelectorAll('sc-legend-row')).toBeEmpty(); + expect(legend.querySelectorAll('iot-app-kit-vis-legend-row')).toBeEmpty(); }); it('filters out string data type when support string is false', async () => { @@ -726,7 +732,7 @@ describe('string data type behavior', () => { supportString: false, }); - expect(legend.querySelectorAll('sc-legend-row')).toHaveLength(1); + expect(legend.querySelectorAll('iot-app-kit-vis-legend-row')).toHaveLength(1); }); }); @@ -760,7 +766,7 @@ describe('visualizesAlarms', () => { supportString: true, }); - const rows = legend.querySelectorAll('sc-legend-row'); + const rows = legend.querySelectorAll('iot-app-kit-vis-legend-row'); expect(rows).toBeEmpty(); }); @@ -771,7 +777,7 @@ describe('visualizesAlarms', () => { supportString: true, // our mock infos are strings, so this is also required }); - const rows = legend.querySelectorAll('sc-legend-row'); + const rows = legend.querySelectorAll('iot-app-kit-vis-legend-row'); expect(rows).toHaveLength(1); const row = rows[0]; @@ -790,7 +796,7 @@ describe('visualizesAlarms', () => { supportString: false, // our mock infos are strings }); - const rows = legend.querySelectorAll('sc-legend-row'); + const rows = legend.querySelectorAll('iot-app-kit-vis-legend-row'); expect(rows).toBeEmpty(); }); }); diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-legend/sc-legend.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-legend/sc-legend.tsx index c4d586703..cc4bded65 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-legend/sc-legend.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-legend/sc-legend.tsx @@ -11,12 +11,12 @@ import { DATA_ALIGNMENT, LEGEND_POSITION } from '../common/constants'; import { StreamType } from '../../../utils/dataConstants'; import { Components } from '../../../components.d'; -import ScLegendRow = Components.ScLegendRow; +import ScLegendRow = Components.IotAppKitVisLegendRow; const noop = () => {}; @Component({ - tag: 'sc-legend', + tag: 'iot-app-kit-vis-legend', styleUrl: './sc-legend.css', shadow: false, }) @@ -85,7 +85,7 @@ export class ScLegend { const { color: valueColor = undefined, icon = undefined } = this.breachedThresholdColor(point, dataStream) || {}; return [ - { if (trendResult.dataStreamId === dataStream.id) { rows.push( - 's line thickness +// Ensure that the line width is equal to the existing 's line thickness const LINE_WIDTH = STROKE_WIDTH; export const LINE_MESH_INDEX = 1; diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-line-chart/sc-line-chart.spec.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-line-chart/sc-line-chart.spec.tsx index de007ae34..e0ee5fac6 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-line-chart/sc-line-chart.spec.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-line-chart/sc-line-chart.spec.tsx @@ -6,8 +6,8 @@ import 'webgl-mock-threejs'; import { newChartSpecPage } from '../../../testing/chartDescriptions/newChartSpecPage'; import { describeChart } from '../../../testing/chartDescriptions/describeChart'; -const lineChart = newChartSpecPage('sc-line-chart'); +const lineChart = newChartSpecPage('iot-app-kit-vis-line-chart'); -describe('sc-line-chart', () => { +describe('iot-app-kit-vis-line-chart', () => { describeChart(lineChart); }); diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-line-chart/sc-line-chart.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-line-chart/sc-line-chart.tsx index 136abdb51..0b1c7f337 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-line-chart/sc-line-chart.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-line-chart/sc-line-chart.tsx @@ -31,10 +31,15 @@ const DEFAULT_MIN_BUFFER_SIZE = 1000; const DEFAULT_BUFFER_FACTOR = 2; const tooltip = (props: Tooltip.Props) => ( - + ); @Component({ - tag: 'sc-line-chart', + tag: 'iot-app-kit-vis-line-chart', shadow: false, }) export class ScLineChart implements ChartConfig { @@ -66,10 +71,10 @@ export class ScLineChart implements ChartConfig { render() { return ( - ( - { +describe('iot-app-kit-vis-scatter-chart', () => { describeChart(scatterChart); }); diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-scatter-chart/sc-scatter-chart.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-scatter-chart/sc-scatter-chart.tsx index 26eb92f7d..7210a79da 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-scatter-chart/sc-scatter-chart.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-scatter-chart/sc-scatter-chart.tsx @@ -31,10 +31,15 @@ const DEFAULT_MIN_BUFFER_SIZE = 1000; const DEFAULT_BUFFER_FACTOR = 2; const tooltip = (props: Tooltip.Props) => ( - + ); @Component({ - tag: 'sc-scatter-chart', + tag: 'iot-app-kit-vis-scatter-chart', shadow: false, }) export class ScScatterChart implements ChartConfig { @@ -66,10 +71,10 @@ export class ScScatterChart implements ChartConfig { render() { return ( - ( - = {}) => { +const rowSpecPage = async (propOverrides: Partial = {}) => { const page = await newSpecPage({ components: [ScStatusTimelineOverlayRow, ScDataStreamName], html: '
', supportsShadowDom: false, }); - const row = page.doc.createElement('sc-status-timeline-overlay-row') as CustomHTMLElement< - Components.ScStatusTimelineOverlayRow + const row = page.doc.createElement('iot-app-kit-vis-status-timeline-overlay-row') as CustomHTMLElement< + Components.IotAppKitVisStatusTimelineOverlayRow >; - const props: Components.ScStatusTimelineOverlayRow = { + const props: Components.IotAppKitVisStatusTimelineOverlayRow = { label: 'some-label', onNameChange: () => {}, isEditing: false, diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline-overlay/sc-status-timeline-overlay-row.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline-overlay/sc-status-timeline-overlay-row.tsx index 9b478566b..ce2d7d298 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline-overlay/sc-status-timeline-overlay-row.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline-overlay/sc-status-timeline-overlay-row.tsx @@ -4,7 +4,7 @@ import { Value } from '../../../value/Value'; import { StatusIcon } from '../../common/constants'; @Component({ - tag: 'sc-status-timeline-overlay-row', + tag: 'iot-app-kit-vis-status-timeline-overlay-row', styleUrl: 'sc-status-timeline-overlay-row.css', shadow: false, }) @@ -21,7 +21,7 @@ export class ScStatusTimelineOverlayRow { render() { return [
-
- {this.icon && } + {this.icon && }
, diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline-overlay/sc-status-timeline-overlay.css b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline-overlay/sc-status-timeline-overlay.css index 4d9561510..2877d2d86 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline-overlay/sc-status-timeline-overlay.css +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline-overlay/sc-status-timeline-overlay.css @@ -1,8 +1,8 @@ -sc-status-timeline-overlay .expando { +iot-app-kit-vis-status-timeline-overlay .expando { flex-grow: 1; } -sc-status-timeline-overlay .overlay-container { +iot-app-kit-vis-status-timeline-overlay .overlay-container { position: absolute; display: flex; flex-direction: column; diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline-overlay/sc-status-timeline-overlay.spec.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline-overlay/sc-status-timeline-overlay.spec.tsx index ddbf604d2..742039a48 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline-overlay/sc-status-timeline-overlay.spec.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline-overlay/sc-status-timeline-overlay.spec.tsx @@ -85,16 +85,16 @@ const DATA_STREAMS_WITH_ALARMS_ASSOCIATED: DataStream = { ], }; -const timelineOverlaySpecPage = async (propOverrides: Partial = {}) => { +const timelineOverlaySpecPage = async (propOverrides: Partial = {}) => { const page = await newSpecPage({ components: [ScStatusTimelineOverlay, ScStatusTimelineOverlayRow], html: '
', supportsShadowDom: false, }); - const timelineOverlay = page.doc.createElement('sc-status-timeline-overlay') as CustomHTMLElement< - Components.ScStatusTimelineOverlay + const timelineOverlay = page.doc.createElement('iot-app-kit-vis-status-timeline-overlay') as CustomHTMLElement< + Components.IotAppKitVisStatusTimelineOverlay >; - const props: Components.ScStatusTimelineOverlay = { + const props: Components.IotAppKitVisStatusTimelineOverlay = { thresholds: [], dataStreams: [], date: VIEWPORT.end, @@ -122,13 +122,13 @@ const timelineOverlaySpecPage = async (propOverrides: Partial { const { timelineOverlay } = await timelineOverlaySpecPage({ dataStreams: [] }); - expect(timelineOverlay.querySelectorAll('sc-status-timeline-overlay-row')).toBeEmpty(); + expect(timelineOverlay.querySelectorAll('iot-app-kit-vis-status-timeline-overlay-row')).toBeEmpty(); }); it('renders multiple rows when given multiple infos', async () => { const { timelineOverlay } = await timelineOverlaySpecPage({ dataStreams: [DATA_STREAM, DATA_STREAM_2] }); - expect(timelineOverlay.querySelectorAll('sc-status-timeline-overlay-row')).toHaveLength(2); + expect(timelineOverlay.querySelectorAll('iot-app-kit-vis-status-timeline-overlay-row')).toHaveLength(2); }); it('displays data point on the timeline-overlay when it falls before the viewport', async () => { @@ -148,7 +148,9 @@ it('displays data point on the timeline-overlay when it falls before the viewpor ], }); - const row = timelineOverlay.querySelector('sc-status-timeline-overlay-row') as HTMLScStatusTimelineOverlayRowElement; + const row = timelineOverlay.querySelector( + 'iot-app-kit-vis-status-timeline-overlay-row' + ) as HTMLIotAppKitVisStatusTimelineOverlayRowElement; expect(row).not.toBeNull(); expect(row.value).toEqual(POINT.y); }); @@ -161,7 +163,7 @@ describe('indicates breaching of thresholds', () => { thresholds: [ALARM_THRESHOLD], }); - const rows = timelineOverlay.querySelectorAll('sc-status-timeline-overlay-row'); + const rows = timelineOverlay.querySelectorAll('iot-app-kit-vis-status-timeline-overlay-row'); expect(rows).toHaveLength(2); expect(rows[0].label).toBe(DATA_STREAM.name); @@ -179,7 +181,7 @@ describe('indicates breaching of thresholds', () => { thresholds: [ALARM_THRESHOLD], }); - const rows = timelineOverlay.querySelectorAll('sc-status-timeline-overlay-row'); + const rows = timelineOverlay.querySelectorAll('iot-app-kit-vis-status-timeline-overlay-row'); expect(rows).toHaveLength(2); expect(rows[0].valueColor).not.toBe(ALARM_THRESHOLD.color); @@ -197,7 +199,7 @@ describe('indicates breaching of thresholds', () => { thresholds: [ALARM_THRESHOLD], }); - const rows = timelineOverlay.querySelectorAll('sc-status-timeline-overlay-row'); + const rows = timelineOverlay.querySelectorAll('iot-app-kit-vis-status-timeline-overlay-row'); expect(rows).toHaveLength(3); expect(rows[0].label).toBe(DATA_STREAMS_WITH_ALARMS_ASSOCIATED.name); @@ -222,8 +224,8 @@ describe('indicates breaching of thresholds', () => { }); const row = timelineOverlay.querySelector( - 'sc-status-timeline-overlay-row' - ) as HTMLScStatusTimelineOverlayRowElement; + 'iot-app-kit-vis-status-timeline-overlay-row' + ) as HTMLIotAppKitVisStatusTimelineOverlayRowElement; expect(row.valueColor).not.toBe(THRESHOLD.color); }); it('does color the row to match a breached threshold', async () => { @@ -242,8 +244,8 @@ describe('indicates breaching of thresholds', () => { thresholds: [{ ...THRESHOLD, dataStreamIds: ['some-fake-id-that-is-not-our-data-stream-id'] }], }); const row = timelineOverlay.querySelector( - 'sc-status-timeline-overlay-row' - ) as HTMLScStatusTimelineOverlayRowElement; + 'iot-app-kit-vis-status-timeline-overlay-row' + ) as HTMLIotAppKitVisStatusTimelineOverlayRowElement; expect(row.valueColor).not.toBe(THRESHOLD.color); }); @@ -265,8 +267,8 @@ describe('indicates breaching of thresholds', () => { thresholds: [THRESHOLD], }); const row = timelineOverlay.querySelector( - 'sc-status-timeline-overlay-row' - ) as HTMLScStatusTimelineOverlayRowElement; + 'iot-app-kit-vis-status-timeline-overlay-row' + ) as HTMLIotAppKitVisStatusTimelineOverlayRowElement; expect(row.valueColor).not.toBe(THRESHOLD.color); }); @@ -289,8 +291,8 @@ describe('indicates breaching of thresholds', () => { }); const row = timelineOverlay.querySelector( - 'sc-status-timeline-overlay-row' - ) as HTMLScStatusTimelineOverlayRowElement; + 'iot-app-kit-vis-status-timeline-overlay-row' + ) as HTMLIotAppKitVisStatusTimelineOverlayRowElement; expect(row.valueColor).toBe(THRESHOLD.color); }); @@ -310,8 +312,8 @@ describe('indicates breaching of thresholds', () => { thresholds: [], }); const row = timelineOverlay.querySelector( - 'sc-status-timeline-overlay-row' - ) as HTMLScStatusTimelineOverlayRowElement; + 'iot-app-kit-vis-status-timeline-overlay-row' + ) as HTMLIotAppKitVisStatusTimelineOverlayRowElement; expect(row.valueColor).toBeUndefined(); }); @@ -331,8 +333,8 @@ describe('indicates breaching of thresholds', () => { thresholds: [THRESHOLD], }); const row = timelineOverlay.querySelector( - 'sc-status-timeline-overlay-row' - ) as HTMLScStatusTimelineOverlayRowElement; + 'iot-app-kit-vis-status-timeline-overlay-row' + ) as HTMLIotAppKitVisStatusTimelineOverlayRowElement; expect(row.valueColor).toBeUndefined(); }); @@ -365,8 +367,8 @@ describe('indicates breaching of thresholds', () => { thresholds: upperLowerThresholds, }); const row = timelineOverlay.querySelector( - 'sc-status-timeline-overlay-row' - ) as HTMLScStatusTimelineOverlayRowElement; + 'iot-app-kit-vis-status-timeline-overlay-row' + ) as HTMLIotAppKitVisStatusTimelineOverlayRowElement; expect(row.valueColor).toBe(LOWER_THRESHOLD.color); }); @@ -401,8 +403,8 @@ describe('indicates breaching of thresholds', () => { }); const row = timelineOverlay.querySelector( - 'sc-status-timeline-overlay-row' - ) as HTMLScStatusTimelineOverlayRowElement; + 'iot-app-kit-vis-status-timeline-overlay-row' + ) as HTMLIotAppKitVisStatusTimelineOverlayRowElement; expect(row.valueColor).toBe(UPPER_THRESHOLD.color); }); }); @@ -424,7 +426,9 @@ describe('is editing', () => { isEditing: true, }); - const streamName = timelineOverlay.querySelector('sc-data-stream-name') as HTMLScDataStreamNameElement; + const streamName = timelineOverlay.querySelector( + 'iot-app-kit-vis-data-stream-name' + ) as HTMLIotAppKitVisDataStreamNameElement; expect(streamName).toHaveAttribute('isEditing'); }); @@ -443,7 +447,9 @@ describe('is editing', () => { isEditing: false, }); - const streamName = timelineOverlay.querySelector('sc-data-stream-name') as HTMLScDataStreamNameElement; + const streamName = timelineOverlay.querySelector( + 'iot-app-kit-vis-data-stream-name' + ) as HTMLIotAppKitVisDataStreamNameElement; expect(streamName).not.toHaveAttribute('isEditing'); }); @@ -461,7 +467,9 @@ describe('is editing', () => { isEditing: undefined, }); - const streamName = timelineOverlay.querySelector('sc-data-stream-name') as HTMLScDataStreamNameElement; + const streamName = timelineOverlay.querySelector( + 'iot-app-kit-vis-data-stream-name' + ) as HTMLIotAppKitVisDataStreamNameElement; expect(streamName).not.toHaveAttribute('isEditing'); }); }); @@ -498,8 +506,8 @@ describe('active point passed into rows', () => { }); const row = timelineOverlay.querySelector( - 'sc-status-timeline-overlay-row' - ) as HTMLScStatusTimelineOverlayRowElement; + 'iot-app-kit-vis-status-timeline-overlay-row' + ) as HTMLIotAppKitVisStatusTimelineOverlayRowElement; expect(row.value).toEqual(POINT_2.y); }); }); diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline-overlay/sc-status-timeline-overlay.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline-overlay/sc-status-timeline-overlay.tsx index 08c51f88c..61278c439 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline-overlay/sc-status-timeline-overlay.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline-overlay/sc-status-timeline-overlay.tsx @@ -12,7 +12,7 @@ import { getDataStreamForEventing } from '../../common'; const SMUDGE_WIDTH_PX = 1; // We slice off a tiny bit of width to prevent some pixels showing under antialiasing @Component({ - tag: 'sc-status-timeline-overlay', + tag: 'iot-app-kit-vis-status-timeline-overlay', styleUrl: 'sc-status-timeline-overlay.css', shadow: false, }) @@ -101,7 +101,7 @@ export class ScStatusTimelineOverlay { const displayedUnit = error == null ? dataStream.unit : undefined; const valueColor = error == null && threshold != null ? threshold.color : undefined; return ( - { describeChart(statusTimeline, { @@ -33,7 +33,7 @@ describe('annotations', () => { }; const { chart } = await statusTimeline({ annotations: ANNOTATIONS }); - const baseChart = chart.querySelector('sc-webgl-base-chart') as HTMLScWebglBaseChartElement; + const baseChart = chart.querySelector('iot-app-kit-vis-webgl-base-chart') as HTMLIotAppKitVisWebglBaseChartElement; expect(baseChart.annotations).toMatchObject({ ...ANNOTATIONS, diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline.tsx index 57e444599..04d8b7e83 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-status-timeline.tsx @@ -49,7 +49,7 @@ const TOP_TOOLTIP_MARGIN_PX = 4; const tooltip = (alarms?: AlarmsConfig) => (props: Tooltip.Props) => { const { size } = props; return ( - { const totalSize = { @@ -138,7 +138,7 @@ export class ScStatusTimeline implements ChartConfig { return [
- -
,
- +
, ]; }} diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-threshold-legend/sc-threshold-legend-row.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-threshold-legend/sc-threshold-legend-row.tsx index ac4ae6a21..69718961c 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-threshold-legend/sc-threshold-legend-row.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-threshold-legend/sc-threshold-legend-row.tsx @@ -1,7 +1,7 @@ import { Component, h, Prop } from '@stencil/core'; @Component({ - tag: 'sc-threshold-legend-row', + tag: 'iot-app-kit-vis-threshold-legend-row', shadow: false, }) export class ScThresholdLegendRow { diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-threshold-legend/sc-threshold-legend.css b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-threshold-legend/sc-threshold-legend.css index ef7ab61a1..bb979158b 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-threshold-legend/sc-threshold-legend.css +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-threshold-legend/sc-threshold-legend.css @@ -1,4 +1,4 @@ -sc-threshold-legend { +iot-app-kit-vis-threshold-legend { display: flex; flex-wrap: wrap; overflow-y: scroll; @@ -8,11 +8,11 @@ sc-threshold-legend { line-height: 22px; } -sc-threshold-legend-row { +iot-app-kit-vis-threshold-legend-row { padding: 0.1em 1em; } -sc-threshold-legend-row .box { +iot-app-kit-vis-threshold-legend-row .box { display: inline-block; border-radius: 2px; margin-right: 8px; diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-threshold-legend/sc-threshold-legend.spec.ts b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-threshold-legend/sc-threshold-legend.spec.ts index a6b7898a5..0dc7e32cb 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-threshold-legend/sc-threshold-legend.spec.ts +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-threshold-legend/sc-threshold-legend.spec.ts @@ -7,16 +7,16 @@ import { ScThresholdLegendRow } from './sc-threshold-legend-row'; import { Threshold } from '../../common/types'; import { COMPARISON_OPERATOR } from '../../common/constants'; -const thresholdLegendSpecPage = async (propOverrides: Partial = {}) => { +const thresholdLegendSpecPage = async (propOverrides: Partial = {}) => { const page = await newSpecPage({ components: [ScThresholdLegend, ScThresholdLegendRow], html: '
', supportsShadowDom: false, }); - const thresholdLegend = page.doc.createElement('sc-threshold-legend') as CustomHTMLElement< - Components.ScThresholdLegend + const thresholdLegend = page.doc.createElement('iot-app-kit-vis-threshold-legend') as CustomHTMLElement< + Components.IotAppKitVisThresholdLegend >; - const props: Partial = { + const props: Partial = { thresholds: [], ...propOverrides, }; @@ -44,13 +44,15 @@ const NUMBER_THRESHOLD: Threshold = { it('renders one row per threshold when one threshold present', async () => { const { thresholdLegend } = await thresholdLegendSpecPage({ thresholds: [THRESHOLD] }); - expect(thresholdLegend.querySelectorAll('sc-threshold-legend-row')).toHaveLength(1); + expect(thresholdLegend.querySelectorAll('iot-app-kit-vis-threshold-legend-row')).toHaveLength(1); }); it('renders the threshold legend row correctly', async () => { const { thresholdLegend } = await thresholdLegendSpecPage({ thresholds: [THRESHOLD] }); - const row = thresholdLegend.querySelector('sc-threshold-legend-row') as HTMLScThresholdLegendRowElement; + const row = thresholdLegend.querySelector( + 'iot-app-kit-vis-threshold-legend-row' + ) as HTMLIotAppKitVisThresholdLegendRowElement; expect(row.label).toEqual(THRESHOLD.value); expect(row.color).toBe(THRESHOLD.color); expect(row.innerText).toContain(THRESHOLD.value); @@ -61,7 +63,7 @@ describe('order', () => { const THRESHOLDS = [NUMBER_THRESHOLD, THRESHOLD]; const { thresholdLegend } = await thresholdLegendSpecPage({ thresholds: THRESHOLDS }); - const rows = thresholdLegend.querySelectorAll('sc-threshold-legend-row'); + const rows = thresholdLegend.querySelectorAll('iot-app-kit-vis-threshold-legend-row'); expect(rows[0].label).toBe(`y < ${THRESHOLDS[0].value}`); expect(rows[1].label).toBe(THRESHOLDS[1].value); @@ -71,7 +73,7 @@ describe('order', () => { const THRESHOLDS = [THRESHOLD, NUMBER_THRESHOLD]; const { thresholdLegend } = await thresholdLegendSpecPage({ thresholds: THRESHOLDS }); - const rows = thresholdLegend.querySelectorAll('sc-threshold-legend-row'); + const rows = thresholdLegend.querySelectorAll('iot-app-kit-vis-threshold-legend-row'); expect(rows[0].label).toBe(THRESHOLDS[0].value); expect(rows[1].label).toBe(`y < ${THRESHOLDS[1].value}`); @@ -84,7 +86,9 @@ describe('renders operators correctly', () => { thresholds: [{ ...THRESHOLD, comparisonOperator: COMPARISON_OPERATOR.GREATER_THAN_EQUAL }], }); - const row = thresholdLegend.querySelector('sc-threshold-legend-row') as HTMLScThresholdLegendRowElement; + const row = thresholdLegend.querySelector( + 'iot-app-kit-vis-threshold-legend-row' + ) as HTMLIotAppKitVisThresholdLegendRowElement; expect(row.label).toEqual(`y >= ${THRESHOLD.value}`); }); @@ -93,7 +97,9 @@ describe('renders operators correctly', () => { thresholds: [{ ...THRESHOLD, comparisonOperator: COMPARISON_OPERATOR.GREATER_THAN }], }); - const row = thresholdLegend.querySelector('sc-threshold-legend-row') as HTMLScThresholdLegendRowElement; + const row = thresholdLegend.querySelector( + 'iot-app-kit-vis-threshold-legend-row' + ) as HTMLIotAppKitVisThresholdLegendRowElement; expect(row.label).toEqual(`y > ${THRESHOLD.value}`); }); @@ -102,7 +108,9 @@ describe('renders operators correctly', () => { thresholds: [{ ...THRESHOLD, comparisonOperator: COMPARISON_OPERATOR.LESS_THAN_EQUAL }], }); - const row = thresholdLegend.querySelector('sc-threshold-legend-row') as HTMLScThresholdLegendRowElement; + const row = thresholdLegend.querySelector( + 'iot-app-kit-vis-threshold-legend-row' + ) as HTMLIotAppKitVisThresholdLegendRowElement; expect(row.label).toEqual(`y <= ${THRESHOLD.value}`); }); @@ -111,7 +119,9 @@ describe('renders operators correctly', () => { thresholds: [{ ...THRESHOLD, comparisonOperator: COMPARISON_OPERATOR.LESS_THAN }], }); - const row = thresholdLegend.querySelector('sc-threshold-legend-row') as HTMLScThresholdLegendRowElement; + const row = thresholdLegend.querySelector( + 'iot-app-kit-vis-threshold-legend-row' + ) as HTMLIotAppKitVisThresholdLegendRowElement; expect(row.label).toEqual(`y < ${THRESHOLD.value}`); }); }); @@ -119,7 +129,7 @@ describe('renders operators correctly', () => { it('renders the threshold legend row color box as the thresholds color', async () => { const { thresholdLegend } = await thresholdLegendSpecPage({ thresholds: [THRESHOLD] }); - const box = thresholdLegend.querySelector('sc-threshold-legend-row .box') as HTMLDivElement; + const box = thresholdLegend.querySelector('iot-app-kit-vis-threshold-legend-row .box') as HTMLDivElement; expect(box).not.toBeNull(); expect(box.style.backgroundColor).toEqual(THRESHOLD.color); @@ -128,20 +138,20 @@ it('renders the threshold legend row color box as the thresholds color', async ( it('renders one row per threshold when two thresholds present', async () => { const { thresholdLegend } = await thresholdLegendSpecPage({ thresholds: [THRESHOLD, NUMBER_THRESHOLD] }); - expect(thresholdLegend.querySelectorAll('sc-threshold-legend-row').length).toBe(2); + expect(thresholdLegend.querySelectorAll('iot-app-kit-vis-threshold-legend-row').length).toBe(2); }); describe('de-duplication behavior for legend rows', () => { it('renders one row for multiple thresholds that would render identical rows', async () => { const { thresholdLegend } = await thresholdLegendSpecPage({ thresholds: [THRESHOLD, THRESHOLD] }); - expect(thresholdLegend.querySelectorAll('sc-threshold-legend-row').length).toBe(1); + expect(thresholdLegend.querySelectorAll('iot-app-kit-vis-threshold-legend-row').length).toBe(1); }); it('renders two rows for two unique thresholds out of three', async () => { const { thresholdLegend } = await thresholdLegendSpecPage({ thresholds: [THRESHOLD, THRESHOLD, NUMBER_THRESHOLD] }); - expect(thresholdLegend.querySelectorAll('sc-threshold-legend-row').length).toBe(2); + expect(thresholdLegend.querySelectorAll('iot-app-kit-vis-threshold-legend-row').length).toBe(2); }); it('renders two rows for two unique thresholds that only differ in color', async () => { @@ -152,7 +162,7 @@ describe('de-duplication behavior for legend rows', () => { ], }); - expect(thresholdLegend.querySelectorAll('sc-threshold-legend-row').length).toBe(2); + expect(thresholdLegend.querySelectorAll('iot-app-kit-vis-threshold-legend-row').length).toBe(2); }); it('renders two rows for two unique thresholds that only differ in value', async () => { @@ -163,6 +173,6 @@ describe('de-duplication behavior for legend rows', () => { ], }); - expect(thresholdLegend.querySelectorAll('sc-threshold-legend-row').length).toBe(2); + expect(thresholdLegend.querySelectorAll('iot-app-kit-vis-threshold-legend-row').length).toBe(2); }); }); diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-threshold-legend/sc-threshold-legend.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-threshold-legend/sc-threshold-legend.tsx index 8d4579924..ef00be2cc 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-threshold-legend/sc-threshold-legend.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-status-timeline/sc-threshold-legend/sc-threshold-legend.tsx @@ -24,7 +24,7 @@ const label = (threshold: Threshold): string => { const key = ({ value, comparisonOperator, color }: Threshold): string => `${value}-${comparisonOperator}-${color}`; @Component({ - tag: 'sc-threshold-legend', + tag: 'iot-app-kit-vis-threshold-legend', styleUrl: 'sc-threshold-legend.css', shadow: false, }) @@ -39,7 +39,7 @@ export class ScThresholdLegend { render() { return this.uniqueThresholds().map(threshold => ( - + )); } } diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-row.css b/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-row.css index 5df713531..97aea7516 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-row.css +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-row.css @@ -1,21 +1,21 @@ -sc-tooltip-row { +iot-app-kit-vis-tooltip-row { font-size: var(--font-size-1); --bar-size: 18px; } -sc-tooltip-rows .left-offset { +iot-app-kit-vis-tooltip-rows .left-offset { padding-left: 4px; } /* modern clearfix hack */ -sc-tooltip-row .clearfix::after { +iot-app-kit-vis-tooltip-row .clearfix::after { content: ''; clear: both; display: table; } -sc-tooltip-row .bar { +iot-app-kit-vis-tooltip-row .bar { display: inline-block; float: left; width: var(--bar-size); @@ -23,13 +23,13 @@ sc-tooltip-row .bar { padding-top: 8px; } -sc-tooltip-row .label { +iot-app-kit-vis-tooltip-row .label { padding-left: var(--margin-small); color: var(--light-text); float: left; } -sc-tooltip-row .value { +iot-app-kit-vis-tooltip-row .value { font-weight: bold; float: right; margin-left: 15px; diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-row.spec.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-row.spec.tsx index d73e38ee9..b8cbcd147 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-row.spec.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-row.spec.tsx @@ -26,14 +26,16 @@ const DEFAULT_POINT: DataPoint = { y: 100, }; -const newTooltipRowPage = async (propOverrides: Partial = {}) => { +const newTooltipRowPage = async (propOverrides: Partial = {}) => { const page = await newSpecPage({ components: [ScTooltipRow], html: '
', supportsShadowDom: false, }); - const tooltipRow = page.doc.createElement('sc-tooltip-row') as CustomHTMLElement; - const props: Components.ScTooltipRow = { + const tooltipRow = page.doc.createElement('iot-app-kit-vis-tooltip-row') as CustomHTMLElement< + Components.IotAppKitVisTooltipRow + >; + const props: Components.IotAppKitVisTooltipRow = { label: DATA_STREAM_INFO.name, color: DATA_STREAM_INFO.color as string, point: DEFAULT_POINT, @@ -69,12 +71,12 @@ describe('valueColor property', () => { describe('icon property', () => { it('renders the icon to be that of the value provided', async () => { const { tooltipRow } = await newTooltipRowPage({ icon: StatusIcon.SNOOZED }); - const value = tooltipRow.querySelector('sc-chart-icon') as any; + const value = tooltipRow.querySelector('iot-app-kit-vis-chart-icon') as any; expect(value).not.toBeNull(); }); it('renders the icon to be empty when no value provided', async () => { const { tooltipRow } = await newTooltipRowPage({}); - const value = tooltipRow.querySelector('sc-chart-icon') as HTMLElement; + const value = tooltipRow.querySelector('iot-app-kit-vis-chart-icon') as HTMLElement; expect(value).toBeNull(); }); }); diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-row.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-row.tsx index 04976d722..302736fc6 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-row.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-row.tsx @@ -14,7 +14,7 @@ import { StatusIcon } from '../common/constants'; const baseColor = '#000'; @Component({ - tag: 'sc-tooltip-row', + tag: 'iot-app-kit-vis-tooltip-row', styleUrl: 'sc-tooltip-row.css', shadow: false, }) @@ -51,7 +51,7 @@ export class ScTooltipRow { {this.label} - {this.icon && } + {this.icon && } {this.resolution != null && ( diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-rows.spec.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-rows.spec.tsx index 109201862..f926870bf 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-rows.spec.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-rows.spec.tsx @@ -86,15 +86,17 @@ const TREND: TrendResult = { startDate: VIEWPORT.start, }; -const newTooltipRowsSpecPage = async (propOverrides: Partial = {}) => { +const newTooltipRowsSpecPage = async (propOverrides: Partial = {}) => { const page = await newSpecPage({ components: [ScTooltipRow, ScTooltipRows], html: '
', supportsShadowDom: false, }); - const tooltipRows = page.doc.createElement('sc-tooltip-rows') as CustomHTMLElement; - const props: Components.ScTooltipRows = { + const tooltipRows = page.doc.createElement('iot-app-kit-vis-tooltip-rows') as CustomHTMLElement< + Components.IotAppKitVisTooltipRows + >; + const props: Components.IotAppKitVisTooltipRows = { dataAlignment: DATA_ALIGNMENT.EITHER, dataStreams: [], selectedDate: VIEWPORT.end, @@ -119,7 +121,7 @@ const newTooltipRowsSpecPage = async (propOverrides: Partial { const { tooltipRows } = await newTooltipRowsSpecPage({}); - const rows = tooltipRows.querySelectorAll('sc-tooltip-row'); + const rows = tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row'); expect(rows).toBeEmpty(); expect(tooltipRows.querySelector(TOOLTIP_LINE_SELECTOR)).toBeNull(); }); @@ -129,7 +131,7 @@ it('renders one tooltip row with the streams point passed in', async () => { dataStreams: [DATA_STREAM], }); - const toolTipRow = tooltipRows.querySelector('sc-tooltip-row') as HTMLScTooltipRowElement; + const toolTipRow = tooltipRows.querySelector('iot-app-kit-vis-tooltip-row') as HTMLIotAppKitVisTooltipRowElement; expect(toolTipRow).toBeDefined(); expect(toolTipRow.point).toBe(DEFAULT_POINT); expect(toolTipRow.pointType).toBe(POINT_TYPE.DATA); @@ -145,7 +147,7 @@ describe('showsBlankTooltipRows is true', () => { showBlankTooltipRows: true, }); - const toolTipRow = tooltipRows.querySelector('sc-tooltip-row') as HTMLScTooltipRowElement; + const toolTipRow = tooltipRows.querySelector('iot-app-kit-vis-tooltip-row') as HTMLIotAppKitVisTooltipRowElement; expect(toolTipRow).not.toBeNull(); expect(toolTipRow.point).toBeUndefined(); expect(toolTipRow.label).toBe(DATA_STREAM.name); @@ -158,7 +160,7 @@ describe('showsBlankTooltipRows is true', () => { showBlankTooltipRows: true, }); - const toolTipRow = tooltipRows.querySelector('sc-tooltip-row') as HTMLScTooltipRowElement; + const toolTipRow = tooltipRows.querySelector('iot-app-kit-vis-tooltip-row') as HTMLIotAppKitVisTooltipRowElement; expect(toolTipRow).not.toBeNull(); expect(toolTipRow.point).toBeUndefined(); expect(toolTipRow.label).toBe(DATA_STREAM.name); @@ -172,7 +174,7 @@ describe('showsBlankTooltipRows is false', () => { showBlankTooltipRows: false, }); - expect(tooltipRows.querySelectorAll('sc-tooltip-row').length).toBe(0); + expect(tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row').length).toBe(0); }); it('renders no tooltip rows when no data present in data stream and is sorting with non raw data', async () => { @@ -184,7 +186,7 @@ describe('showsBlankTooltipRows is false', () => { showBlankTooltipRows: false, }); - expect(tooltipRows.querySelectorAll('sc-tooltip-row').length).toBe(0); + expect(tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row').length).toBe(0); }); }); @@ -193,7 +195,7 @@ it('renders no tooltip rows when no data stream provided', async () => { dataStreams: [], }); - expect(tooltipRows.querySelectorAll('sc-tooltip-row')).toBeEmpty(); + expect(tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row')).toBeEmpty(); }); describe('visualizesAlarms', () => { @@ -217,7 +219,7 @@ describe('visualizesAlarms', () => { dataStreams: [NUMERICAL_ALARM_STREAM], visualizesAlarms: false, }); - expect(tooltipRows.querySelectorAll('sc-tooltip-row')).toBeEmpty(); + expect(tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row')).toBeEmpty(); }); it('does render tooltip rows for alarms if `visualizesAlarms` is true', async () => { @@ -226,9 +228,9 @@ describe('visualizesAlarms', () => { visualizesAlarms: true, }); - expect(tooltipRows.querySelectorAll('sc-tooltip-row')).not.toBeEmpty(); + expect(tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row')).not.toBeEmpty(); - const row = tooltipRows.querySelector('sc-tooltip-row') as HTMLScTooltipRowElement; + const row = tooltipRows.querySelector('iot-app-kit-vis-tooltip-row') as HTMLIotAppKitVisTooltipRowElement; expect(row.point).toEqual(NUMERICAL_ALARM_STREAM.data[0]); expect(row.label).toEqual(NUMERICAL_ALARM_STREAM.name); expect(row.valueColor).toEqual(DEFAULT_TOOLTIP_VALUE_COLOR); @@ -243,10 +245,10 @@ describe('supportsString', () => { supportString: true, }); - const rows = tooltipRows.querySelectorAll('sc-tooltip-row'); + const rows = tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row'); expect(rows).toHaveLength(1); - const row = tooltipRows.querySelector('sc-tooltip-row') as HTMLScTooltipRowElement; + const row = tooltipRows.querySelector('iot-app-kit-vis-tooltip-row') as HTMLIotAppKitVisTooltipRowElement; expect(row.label).toBe(STRING_STREAM_INFO.name); expect(row.point).toBe(DEFAULT_STRING_POINT); }); @@ -257,7 +259,7 @@ describe('supportsString', () => { supportString: true, }); - const rows = tooltipRows.querySelectorAll('sc-tooltip-row'); + const rows = tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row'); expect(rows).toHaveLength(2); }); }); @@ -269,7 +271,7 @@ describe('supportsString', () => { supportString: false, }); - const rows = tooltipRows.querySelectorAll('sc-tooltip-row'); + const rows = tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row'); expect(rows).toBeEmpty(); }); @@ -279,10 +281,10 @@ describe('supportsString', () => { supportString: false, }); - const rows = tooltipRows.querySelectorAll('sc-tooltip-row'); + const rows = tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row'); expect(rows).toHaveLength(1); - const row = tooltipRows.querySelector('sc-tooltip-row') as HTMLScTooltipRowElement; + const row = tooltipRows.querySelector('iot-app-kit-vis-tooltip-row') as HTMLIotAppKitVisTooltipRowElement; expect(row.label).toBe(DATA_STREAM.name); expect(row.point).toBe(DEFAULT_POINT); }); @@ -296,7 +298,7 @@ it('passes down showStreamColor to tooltip-row', async () => { showDataStreamColor: SHOW_STREAM_COLOR, }); - const toolTipRow = tooltipRows.querySelector('sc-tooltip-row') as HTMLScTooltipRowElement; + const toolTipRow = tooltipRows.querySelector('iot-app-kit-vis-tooltip-row') as HTMLIotAppKitVisTooltipRowElement; expect(toolTipRow.showDataStreamColor).toBe(SHOW_STREAM_COLOR); }); @@ -306,7 +308,7 @@ it('renders one trend result', async () => { trendResults: [TREND], }); - const rows = tooltipRows.querySelectorAll('sc-tooltip-row'); + const rows = tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row'); expect(rows).toHaveLength(2); @@ -323,7 +325,7 @@ it('renders no trend line row when trend does not associate with any streams', a trendResults: [{ ...TREND, dataStreamId: 'some-random-id' }], }); - const rows = tooltipRows.querySelectorAll('sc-tooltip-row'); + const rows = tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row'); expect(rows).toBeEmpty(); }); @@ -346,7 +348,7 @@ describe('threshold breaching logic', () => { thresholds: [], }); - const toolTipRow = tooltipRows.querySelector('sc-tooltip-row') as HTMLScTooltipRowElement; + const toolTipRow = tooltipRows.querySelector('iot-app-kit-vis-tooltip-row') as HTMLIotAppKitVisTooltipRowElement; expect(toolTipRow.valueColor).toBe(DEFAULT_TOOLTIP_VALUE_COLOR); }); @@ -358,7 +360,7 @@ describe('threshold breaching logic', () => { thresholds: [THRESHOLD], }); - const toolTipRow = tooltipRows.querySelector('sc-tooltip-row') as HTMLScTooltipRowElement; + const toolTipRow = tooltipRows.querySelector('iot-app-kit-vis-tooltip-row') as HTMLIotAppKitVisTooltipRowElement; expect(toolTipRow.valueColor).toBe(THRESHOLD.color); expect(toolTipRow.icon).toBe(THRESHOLD.icon); }); @@ -369,7 +371,7 @@ describe('threshold breaching logic', () => { thresholds: [{ ...THRESHOLD, dataStreamIds: ['some-fake-data-stream-id'] }], }); - const toolTipRow = tooltipRows.querySelector('sc-tooltip-row') as HTMLScTooltipRowElement; + const toolTipRow = tooltipRows.querySelector('iot-app-kit-vis-tooltip-row') as HTMLIotAppKitVisTooltipRowElement; expect(toolTipRow.valueColor).not.toBe(THRESHOLD.color); expect(toolTipRow.icon).not.toBe(THRESHOLD.icon); }); @@ -388,7 +390,7 @@ describe('threshold breaching logic', () => { thresholds: [THRESHOLD], }); - const toolTipRow = tooltipRows.querySelector('sc-tooltip-row') as HTMLScTooltipRowElement; + const toolTipRow = tooltipRows.querySelector('iot-app-kit-vis-tooltip-row') as HTMLIotAppKitVisTooltipRowElement; expect(toolTipRow.valueColor).not.toBe(THRESHOLD.color); expect(toolTipRow.icon).not.toBe(THRESHOLD.icon); }); @@ -406,7 +408,7 @@ describe('threshold breaching logic', () => { thresholds: [THRESHOLD], }); - const rows = tooltipRows.querySelectorAll('sc-tooltip-row'); + const rows = tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row'); expect(rows).toHaveLength(1); const row = rows[0]; @@ -428,7 +430,7 @@ describe('threshold breaching logic', () => { thresholds: [THRESHOLD], }); - const rows = tooltipRows.querySelectorAll('sc-tooltip-row'); + const rows = tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row'); expect(rows).toHaveLength(1); const row = rows[0]; @@ -443,7 +445,7 @@ describe('threshold breaching logic', () => { thresholds: [THRESHOLD], }); - const toolTipRow = tooltipRows.querySelector('sc-tooltip-row') as HTMLScTooltipRowElement; + const toolTipRow = tooltipRows.querySelector('iot-app-kit-vis-tooltip-row') as HTMLIotAppKitVisTooltipRowElement; expect(toolTipRow.valueColor).not.toBe(THRESHOLD.color); expect(toolTipRow.icon).not.toBe(THRESHOLD.icon); }); @@ -478,7 +480,7 @@ describe('threshold breaching logic', () => { ], thresholds: upperLowerThresholds, }); - const row = tooltipRows.querySelector('sc-tooltip-row') as HTMLScTooltipRowElement; + const row = tooltipRows.querySelector('iot-app-kit-vis-tooltip-row') as HTMLIotAppKitVisTooltipRowElement; expect(row.valueColor).toBe(UPPER_THRESHOLD.color); }); @@ -511,7 +513,7 @@ describe('threshold breaching logic', () => { ], thresholds: upperLowerThresholds, }); - const row = tooltipRows.querySelector('sc-tooltip-row') as HTMLScTooltipRowElement; + const row = tooltipRows.querySelector('iot-app-kit-vis-tooltip-row') as HTMLIotAppKitVisTooltipRowElement; expect(row.valueColor).toBe(LOWER_THRESHOLD.color); }); @@ -525,7 +527,7 @@ describe('order of rows', () => { showBlankTooltipRows: true, sortPoints: true, }); - const rows = tooltipRows.querySelectorAll('sc-tooltip-row'); + const rows = tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row'); expect(rows.length).toBe(3); // undefined point re-positioned to the start of the tooltip @@ -554,7 +556,7 @@ describe('order of rows', () => { sortPoints: true, }); - const rows = tooltipRows.querySelectorAll('sc-tooltip-row'); + const rows = tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row'); expect(rows.length).toBe(dataStreams.length); expect(rows[0].label).toBe(NUMBER_EMPTY_STREAM.name); @@ -576,7 +578,7 @@ describe('order of rows', () => { dataStreams, sortPoints: false, }); - const rows = tooltipRows.querySelectorAll('sc-tooltip-row'); + const rows = tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row'); expect(rows).toHaveLength(dataStreams.length); // First row is the first data @@ -595,7 +597,7 @@ describe('order of rows', () => { showBlankTooltipRows: true, sortPoints: false, }); - const rows = tooltipRows.querySelectorAll('sc-tooltip-row'); + const rows = tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row'); expect(rows.length).toBe(dataStreams.length); expect(rows[0].label).toBe(dataStreams[0].name); @@ -619,7 +621,7 @@ describe('order of rows', () => { sortPoints: true, }); - const rows = tooltipRows.querySelectorAll('sc-tooltip-row'); + const rows = tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row'); expect(rows).toHaveLength(2); const r1 = rows[0]; @@ -641,7 +643,7 @@ describe('does not utilize alarms', () => { visualizesAlarms: true, thresholds: [ALARM_THRESHOLD], }); - const rows = tooltipRows.querySelectorAll('sc-tooltip-row'); + const rows = tooltipRows.querySelectorAll('iot-app-kit-vis-tooltip-row'); /** Alarm Row */ const alarmRow = rows[0]; diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-rows.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-rows.tsx index c58450eb4..0a4e1979f 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-rows.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-tooltip/sc-tooltip-rows.tsx @@ -26,7 +26,7 @@ const X_OFFSET = 8; * Renders the tooltip, tooltip container, the tooltip line and the tool tip rows */ @Component({ - tag: 'sc-tooltip-rows', + tag: 'iot-app-kit-vis-tooltip-rows', shadow: false, }) export class ScTooltipRows { @@ -237,7 +237,7 @@ export class ScTooltipRows { (tooltipPoint.point && this.rowsValueColorAndIcon(streamId, tooltipPoint.point, displayedDate)) || {}; return ( - - Stopped + Stopped
) : ( diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/LoadingStatus.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/LoadingStatus.tsx index d858218e2..343dd203c 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/LoadingStatus.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/LoadingStatus.tsx @@ -15,6 +15,6 @@ export const LoadingStatus = ({ isLoading }: { isLoading: boolean }) => ( pointerEvents: 'none', }} > - {isLoading && } + {isLoading && }
); diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-gesture-handler.css b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-gesture-handler.css index 160e927dd..fc019c15e 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-gesture-handler.css +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-gesture-handler.css @@ -1,22 +1,22 @@ -sc-gesture-handler svg { +iot-app-kit-vis-gesture-handler svg { position: absolute; width: 100%; height: 100%; } -sc-gesture-handler line { +iot-app-kit-vis-gesture-handler line { stroke: var(--selection-color); opacity: 0.3; stroke-width: 1.5px; } -sc-gesture-handler .overlay { +iot-app-kit-vis-gesture-handler .overlay { fill: none; pointer-events: all; cursor: crosshair; } -sc-gesture-handler .brush-box { +iot-app-kit-vis-gesture-handler .brush-box { fill: var(--selection-color); opacity: 0.2; } diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-gesture-handler.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-gesture-handler.tsx index 17c47dbc5..ef4a499f0 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-gesture-handler.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-gesture-handler.tsx @@ -19,7 +19,7 @@ const MOVEMENT_CONFIG: MovementConfig = { }; @Component({ - tag: 'sc-gesture-handler', + tag: 'iot-app-kit-vis-gesture-handler', styleUrl: 'sc-gesture-handler.css', shadow: false, }) diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-axis.css b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-axis.css index 2206e3539..d4aaadfb0 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-axis.css +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-axis.css @@ -1,8 +1,8 @@ -sc-webgl-axis { +iot-app-kit-vis-webgl-axis { font-size: var(--font-size-0); } -sc-webgl-axis .axis { +iot-app-kit-vis-webgl-axis .axis { font-family: var(--primary-font-family); shape-rendering: crispEdges; position: absolute; @@ -11,29 +11,29 @@ sc-webgl-axis .axis { pointer-events: none; } -sc-webgl-axis .axis path { +iot-app-kit-vis-webgl-axis .axis path { display: none; } -sc-webgl-axis .axis .tick { +iot-app-kit-vis-webgl-axis .axis .tick { color: var(--polaris-light-gray); } -sc-webgl-axis line.x-axis-separator { +iot-app-kit-vis-webgl-axis line.x-axis-separator { color: var(--primary-light); stroke: var(--primary-light); stroke-width: 1px; } -sc-webgl-axis .axis .tick line { +iot-app-kit-vis-webgl-axis .axis .tick line { color: var(--primary-light); } -sc-webgl-axis .axis .tick text { +iot-app-kit-vis-webgl-axis .axis .tick text { font-size: var(--font-size-0); user-select: none; } -sc-webgl-axis .x-axis .tick:last-child text { +iot-app-kit-vis-webgl-axis .x-axis .tick:last-child text { font-weight: var(--font-weight-bold); } diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-axis.spec.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-axis.spec.tsx index 4ca82cb78..08bbffaa0 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-axis.spec.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-axis.spec.tsx @@ -32,9 +32,11 @@ const axisSpecPage = async (axisRendererProps?: Partial) => { supportsShadowDom: false, }); - const axis = page.doc.createElement('sc-webgl-axis') as CustomHTMLElement; + const axis = page.doc.createElement('iot-app-kit-vis-webgl-axis') as CustomHTMLElement< + Components.IotAppKitVisWebglAxis + >; - const props: Components.ScWebglAxis = { + const props: Components.IotAppKitVisWebglAxis = { size: SIZE_CONFIG, }; update(axis, props); @@ -149,7 +151,7 @@ describe('updated correctly', () => { const { axis, page } = await axisSpecPage(); const NEW_HEIGHT = 500; const NEW_WIDTH = 550; - const updatedProps: Partial = { + const updatedProps: Partial = { size: { ...SIZE_CONFIG, width: NEW_WIDTH, diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-axis.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-axis.tsx index a269f953e..543a17012 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-axis.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-axis.tsx @@ -2,7 +2,7 @@ import { Component, h, Prop } from '@stencil/core'; import { SizeConfig } from '../../../utils/dataTypes'; @Component({ - tag: 'sc-webgl-axis', + tag: 'iot-app-kit-vis-webgl-axis', styleUrl: 'sc-webgl-axis.css', shadow: false, }) diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-base-chart.css b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-base-chart.css index 058e8f2a4..f370a6dd3 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-base-chart.css +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-base-chart.css @@ -1,8 +1,8 @@ -sc-webgl-base-chart .sc-webgl-base-chart { +iot-app-kit-vis-webgl-base-chart .sc-webgl-base-chart { height: 0; } -sc-webgl-base-chart .empty-status { +iot-app-kit-vis-webgl-base-chart .empty-status { z-index: 11; position: absolute; width: 100%; @@ -17,14 +17,14 @@ sc-webgl-base-chart .empty-status { font-size: var(--font-size-1); } -sc-webgl-base-chart .empty-status h3 { +iot-app-kit-vis-webgl-base-chart .empty-status h3 { font-size: var(--font-size-3); line-height: var(--line-height-3); padding-bottom: var(--font-size-2); font-weight: normal; } -sc-webgl-base-chart .data-container { +iot-app-kit-vis-webgl-base-chart .data-container { position: absolute; } @@ -32,7 +32,7 @@ sc-webgl-base-chart .data-container { * Chart Brush */ -sc-webgl-base-chart .selection { +iot-app-kit-vis-webgl-base-chart .selection { fill: rgba(41, 168, 221, var(--selection-opacity)); stroke-width: var(--selection-width); stroke: var(--selection-color); @@ -40,7 +40,7 @@ sc-webgl-base-chart .selection { z-index: 11; } -sc-webgl-base-chart .chart-legend-container { +iot-app-kit-vis-webgl-base-chart .chart-legend-container { /* Hide scrollbar for IE and Edge */ -ms-overflow-style: none; @@ -49,18 +49,18 @@ sc-webgl-base-chart .chart-legend-container { } /* Hide scrollbar for Chrome, Safari and Opera */ -sc-webgl-base-chart .chart-legend-container::-webkit-scrollbar { +iot-app-kit-vis-webgl-base-chart .chart-legend-container::-webkit-scrollbar { display: none; } -sc-webgl-base-chart .threshold-container { +iot-app-kit-vis-webgl-base-chart .threshold-container { z-index: 5; position: absolute; pointer-events: none; font-size: 12px; } -sc-webgl-base-chart .trend-container { +iot-app-kit-vis-webgl-base-chart .trend-container { z-index: 4; position: absolute; pointer-events: none; diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-base-chart.spec.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-base-chart.spec.tsx index 692b90e99..173412bff 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-base-chart.spec.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-base-chart.spec.tsx @@ -53,15 +53,17 @@ const LOADING_STREAM: DataStream = { isLoading: true, }; -const newChartSpecPage = async (chartProps: Partial) => { +const newChartSpecPage = async (chartProps: Partial) => { const page = await newSpecPage({ components: [ScWebglBaseChart, ScGestureHandler, ScWebglAxis, ScErrorBadge], html: '
', supportsShadowDom: false, }); - const chart = page.doc.createElement('sc-webgl-base-chart') as CustomHTMLElement; + const chart = page.doc.createElement('iot-app-kit-vis-webgl-base-chart') as CustomHTMLElement< + Components.IotAppKitVisWebglBaseChart + >; - const defaultProps: Components.ScWebglBaseChart = { + const defaultProps: Components.IotAppKitVisWebglBaseChart = { updateChartScene, visualizesAlarms: false, yRangeStartFromZero: false, @@ -90,7 +92,7 @@ const newChartSpecPage = async (chartProps: Partial position: LEGEND_POSITION.BOTTOM, width: 300, }, - renderLegend: props => , + renderLegend: props => , isEditing: false, annotations: { x: [], @@ -102,7 +104,12 @@ const newChartSpecPage = async (chartProps: Partial messageOverrides: undefined, trends: [], renderTooltip: ({ visualizesAlarms = defaultProps.visualizesAlarms, ...rest }) => ( - + ), }; @@ -121,7 +128,7 @@ describe('legend', () => { }, }); - const legend = chart.querySelector('sc-legend'); + const legend = chart.querySelector('iot-app-kit-vis-legend'); expect(legend).toBeDefined(); }); @@ -134,7 +141,7 @@ describe('legend', () => { isEditing: true, }); - const legend = chart.querySelector('sc-legend'); + const legend = chart.querySelector('iot-app-kit-vis-legend'); expect(legend).toHaveAttribute('isEditing'); }); @@ -147,7 +154,7 @@ describe('legend', () => { viewport: VIEWPORT, }); - const legend = chart.querySelector('sc-legend') as HTMLScLegendElement; + const legend = chart.querySelector('iot-app-kit-vis-legend') as HTMLIotAppKitVisLegendElement; expect(legend.viewport).toEqual(VIEWPORT); }); @@ -532,7 +539,7 @@ describe('loading status', () => { }); const loadingSpinner = chart.querySelector(LOADING_SPINNER_SELECTOR); - const legend = chart.querySelector('sc-legend'); + const legend = chart.querySelector('iot-app-kit-vis-legend'); expect(legend).toHaveAttribute('isLoading'); expect(loadingSpinner).not.toBeNull(); @@ -544,7 +551,7 @@ describe('loading status', () => { }); const loadingSpinner = chart.querySelector(LOADING_SPINNER_SELECTOR); - const legend = chart.querySelector('sc-legend') as HTMLScLegendElement; + const legend = chart.querySelector('iot-app-kit-vis-legend') as HTMLIotAppKitVisLegendElement; expect(legend).not.toHaveAttribute('isLoading'); expect(loadingSpinner).toBeNull(); @@ -556,7 +563,7 @@ describe('loading status', () => { }); const loadingSpinner = chart.querySelector(LOADING_SPINNER_SELECTOR); - const legend = chart.querySelector('sc-legend') as HTMLScLegendElement; + const legend = chart.querySelector('iot-app-kit-vis-legend') as HTMLIotAppKitVisLegendElement; expect(legend).not.toHaveAttribute('isLoading'); expect(loadingSpinner).toBeNull(); @@ -612,7 +619,7 @@ describe('with string data', () => { }) ); - expect(chart.querySelector('sc-legend')).toHaveAttribute('supportString'); + expect(chart.querySelector('iot-app-kit-vis-legend')).toHaveAttribute('supportString'); }); }); }); diff --git a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-base-chart.tsx b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-base-chart.tsx index 659c0a764..fe83e5f7a 100644 --- a/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-base-chart.tsx +++ b/packages/iot-app-kit-visualizations/src/components/charts/sc-webgl-base-chart/sc-webgl-base-chart.tsx @@ -62,7 +62,7 @@ const LEGEND_HEIGHT = 100; const DEFAULT_SHOW_DATA_STREAM_COLOR = true; @Component({ - tag: 'sc-webgl-base-chart', + tag: 'iot-app-kit-vis-webgl-base-chart', styleUrl: './sc-webgl-base-chart.css', shadow: false, }) @@ -88,7 +88,7 @@ export class ScWebglBaseChart { @Prop() bufferFactor!: number; @Prop() minBufferSize!: number; @Prop() legend: LegendConfig; - @Prop() renderLegend: (props: Legend.Props) => HTMLElement = props => ; + @Prop() renderLegend: (props: Legend.Props) => HTMLElement = props => ; @Prop() annotations: Annotations = {}; @Prop() trends: Trend[] = []; @Prop() supportString: boolean; @@ -178,7 +178,7 @@ export class ScWebglBaseChart { getAxisContainer = (): SVGElement => { if (!this.axisContainer) { - // Grab the svg within `` component + // Grab the svg within `` component this.axisContainer = this.el.querySelector('svg.axis') as SVGElement; } @@ -892,7 +892,7 @@ export class ScWebglBaseChart { return [
{this.displaysError && } - + {this.gestures && ( - {}; -const newDataStreamNameSpecPage = async (props: Partial) => { +const newDataStreamNameSpecPage = async (props: Partial) => { const page = await newSpecPage({ components: [ScDataStreamName], html: '
', supportsShadowDom: false, }); - const dataStreamName = page.doc.createElement('sc-data-stream-name') as CustomHTMLElement< - Components.ScDataStreamName + const dataStreamName = page.doc.createElement('iot-app-kit-vis-data-stream-name') as CustomHTMLElement< + Components.IotAppKitVisDataStreamName >; - const defaultProps: Components.ScDataStreamName = { + const defaultProps: Components.IotAppKitVisDataStreamName = { onNameChange: noop, isEditing: false, label: 'some-label', diff --git a/packages/iot-app-kit-visualizations/src/components/sc-data-stream-name/sc-data-stream-name.tsx b/packages/iot-app-kit-visualizations/src/components/sc-data-stream-name/sc-data-stream-name.tsx index a70ba9740..370c97181 100644 --- a/packages/iot-app-kit-visualizations/src/components/sc-data-stream-name/sc-data-stream-name.tsx +++ b/packages/iot-app-kit-visualizations/src/components/sc-data-stream-name/sc-data-stream-name.tsx @@ -5,7 +5,7 @@ import { POINT_TYPE } from '../charts/sc-webgl-base-chart/activePoints'; import { TIPPY_SETTINGS } from '../common/toolTipSettings'; @Component({ - tag: 'sc-data-stream-name', + tag: 'iot-app-kit-vis-data-stream-name', styleUrl: 'sc-data-stream-name.css', shadow: false, }) @@ -30,7 +30,7 @@ export class ScDataStreamName { renderTooltip = () => { if (this.displayTooltip) { - const container = this.el.querySelector('sc-expandable-input'); + const container = this.el.querySelector('iot-app-kit-vis-expandable-input'); const tooltip = this.el.querySelector('.data-stream-name-tooltip') as HTMLElement | undefined; if (tooltip != null && container != null) { @@ -46,7 +46,7 @@ export class ScDataStreamName { render() { return (
- { this.onNameChange(value); diff --git a/packages/iot-app-kit-visualizations/src/components/sc-error-badge/sc-error-badge.css b/packages/iot-app-kit-visualizations/src/components/sc-error-badge/sc-error-badge.css index 380af22be..54d29e958 100644 --- a/packages/iot-app-kit-visualizations/src/components/sc-error-badge/sc-error-badge.css +++ b/packages/iot-app-kit-visualizations/src/components/sc-error-badge/sc-error-badge.css @@ -1,11 +1,11 @@ -sc-error-badge div { +iot-app-kit-vis-error-badge div { display: flex; padding-left: 1.4286em; line-height: 1.4286em; color: var(--error-badge-font-color, #6a7070); } -sc-error-badge .warning-symbol { +iot-app-kit-vis-error-badge .warning-symbol { font-size: 2rem; padding-right: var(--margin-small); font-weight: bold; diff --git a/packages/iot-app-kit-visualizations/src/components/sc-error-badge/sc-error-badge.tsx b/packages/iot-app-kit-visualizations/src/components/sc-error-badge/sc-error-badge.tsx index 74d44dc25..275327d20 100644 --- a/packages/iot-app-kit-visualizations/src/components/sc-error-badge/sc-error-badge.tsx +++ b/packages/iot-app-kit-visualizations/src/components/sc-error-badge/sc-error-badge.tsx @@ -1,7 +1,7 @@ import { Component, h } from '@stencil/core'; @Component({ - tag: 'sc-error-badge', + tag: 'iot-app-kit-vis-error-badge', styleUrl: 'sc-error-badge.css', shadow: false, }) diff --git a/packages/iot-app-kit-visualizations/src/components/sc-expandable-input/sc-expandable-input.css b/packages/iot-app-kit-visualizations/src/components/sc-expandable-input/sc-expandable-input.css index 2b31322ce..dda548fbb 100644 --- a/packages/iot-app-kit-visualizations/src/components/sc-expandable-input/sc-expandable-input.css +++ b/packages/iot-app-kit-visualizations/src/components/sc-expandable-input/sc-expandable-input.css @@ -1,4 +1,4 @@ -sc-expandable-input .sc-expandable-input { +iot-app-kit-vis-expandable-input .sc-expandable-input { display: inline-block; background: none; color: inherit; @@ -10,7 +10,7 @@ sc-expandable-input .sc-expandable-input { border-bottom: var(--border-width) solid var(--polaris-gray-400); } -sc-expandable-input .sc-expandable-input.disabled { +iot-app-kit-vis-expandable-input .sc-expandable-input.disabled { outline: none; border-bottom-color: rgba(0, 0, 0, 0); } diff --git a/packages/iot-app-kit-visualizations/src/components/sc-expandable-input/sc-expandable-input.spec.tsx b/packages/iot-app-kit-visualizations/src/components/sc-expandable-input/sc-expandable-input.spec.tsx index 8d9e94d05..5a310334d 100644 --- a/packages/iot-app-kit-visualizations/src/components/sc-expandable-input/sc-expandable-input.spec.tsx +++ b/packages/iot-app-kit-visualizations/src/components/sc-expandable-input/sc-expandable-input.spec.tsx @@ -7,13 +7,15 @@ import { Components } from '../../components.d'; const noop = () => {}; -const newInputSpecPage = async (props: Components.ScExpandableInput) => { +const newInputSpecPage = async (props: Components.IotAppKitVisExpandableInput) => { const page = await newSpecPage({ components: [ScExpandableInput], html: '
', supportsShadowDom: false, }); - const input = page.doc.createElement('sc-expandable-input') as CustomHTMLElement; + const input = page.doc.createElement('iot-app-kit-vis-expandable-input') as CustomHTMLElement< + Components.IotAppKitVisExpandableInput + >; update(input, props); page.body.appendChild(input); await page.waitForChanges(); diff --git a/packages/iot-app-kit-visualizations/src/components/sc-expandable-input/sc-expandable-input.tsx b/packages/iot-app-kit-visualizations/src/components/sc-expandable-input/sc-expandable-input.tsx index de8268de0..218428603 100644 --- a/packages/iot-app-kit-visualizations/src/components/sc-expandable-input/sc-expandable-input.tsx +++ b/packages/iot-app-kit-visualizations/src/components/sc-expandable-input/sc-expandable-input.tsx @@ -6,7 +6,7 @@ import { Component, h, Prop } from '@stencil/core'; * An stylized input which grows as you type into it. */ @Component({ - tag: 'sc-expandable-input', + tag: 'iot-app-kit-vis-expandable-input', styleUrl: 'sc-expandable-input.css', shadow: false, }) diff --git a/packages/iot-app-kit-visualizations/src/components/sc-loading-spinner/sc-loading-spinner.spec.tsx b/packages/iot-app-kit-visualizations/src/components/sc-loading-spinner/sc-loading-spinner.spec.tsx index 774a7c978..19dbe66de 100644 --- a/packages/iot-app-kit-visualizations/src/components/sc-loading-spinner/sc-loading-spinner.spec.tsx +++ b/packages/iot-app-kit-visualizations/src/components/sc-loading-spinner/sc-loading-spinner.spec.tsx @@ -5,13 +5,15 @@ import { CustomHTMLElement } from '../../utils/types'; import { Components } from '../../components'; import { ScLoadingSpinner } from './sc-loading-spinner'; -const newLoadingSpinner = async (props: Partial = {}) => { +const newLoadingSpinner = async (props: Partial = {}) => { const page = await newSpecPage({ components: [ScLoadingSpinner], html: '
', supportsShadowDom: true, }); - const loadingSpinner = page.doc.createElement('sc-loading-spinner') as CustomHTMLElement; + const loadingSpinner = page.doc.createElement('iot-app-kit-vis-loading-spinner') as CustomHTMLElement< + Components.IotAppKitVisLoadingSpinner + >; update(loadingSpinner, props); page.body.appendChild(loadingSpinner); await page.waitForChanges(); diff --git a/packages/iot-app-kit-visualizations/src/components/sc-loading-spinner/sc-loading-spinner.tsx b/packages/iot-app-kit-visualizations/src/components/sc-loading-spinner/sc-loading-spinner.tsx index 2182b17f5..bba5ba649 100644 --- a/packages/iot-app-kit-visualizations/src/components/sc-loading-spinner/sc-loading-spinner.tsx +++ b/packages/iot-app-kit-visualizations/src/components/sc-loading-spinner/sc-loading-spinner.tsx @@ -7,7 +7,7 @@ import { Component, h, Prop } from '@stencil/core'; */ @Component({ - tag: 'sc-loading-spinner', + tag: 'iot-app-kit-vis-loading-spinner', styleUrl: 'sc-loading-spinner.css', shadow: true, }) diff --git a/packages/iot-app-kit-visualizations/src/components/sc-size-provider/sc-size-provider.css b/packages/iot-app-kit-visualizations/src/components/sc-size-provider/sc-size-provider.css index 89e72e54d..3dc1f5347 100644 --- a/packages/iot-app-kit-visualizations/src/components/sc-size-provider/sc-size-provider.css +++ b/packages/iot-app-kit-visualizations/src/components/sc-size-provider/sc-size-provider.css @@ -1,4 +1,4 @@ -sc-size-provider .sc-size-provider-container { +iot-app-kit-vis-size-provider .sc-size-provider-container { width: 100%; height: 100%; } diff --git a/packages/iot-app-kit-visualizations/src/components/sc-size-provider/sc-size-provider.spec.tsx b/packages/iot-app-kit-visualizations/src/components/sc-size-provider/sc-size-provider.spec.tsx index 74bd473ce..62f513129 100644 --- a/packages/iot-app-kit-visualizations/src/components/sc-size-provider/sc-size-provider.spec.tsx +++ b/packages/iot-app-kit-visualizations/src/components/sc-size-provider/sc-size-provider.spec.tsx @@ -12,17 +12,22 @@ import { ScBox } from '../../testing/testing-ground/sc-box/sc-box'; import { SECOND_IN_MS } from '../../utils/time'; import { wait } from '../../testing/wait'; -const newWidgetSizerSpecPage = async (containerSize: Size, overrides: Partial = {}) => { +const newWidgetSizerSpecPage = async ( + containerSize: Size, + overrides: Partial = {} +) => { const { width, height } = containerSize; const page = await newSpecPage({ components: [ScSizeProvider, ScBox], html: `
`, supportsShadowDom: false, }); - const widgetSizer = page.doc.createElement('sc-size-provider') as CustomHTMLElement; + const widgetSizer = page.doc.createElement('iot-app-kit-vis-size-provider') as CustomHTMLElement< + Components.IotAppKitVisSizeProvider + >; - const defaultProps: Components.ScSizeProvider = { - renderFunc: jest.fn((size: Size) => ), + const defaultProps: Components.IotAppKitVisSizeProvider = { + renderFunc: jest.fn((size: Size) => ), }; update(widgetSizer, { ...defaultProps, ...overrides }); diff --git a/packages/iot-app-kit-visualizations/src/components/sc-size-provider/sc-size-provider.tsx b/packages/iot-app-kit-visualizations/src/components/sc-size-provider/sc-size-provider.tsx index f14c737c4..4cf9cb6e2 100644 --- a/packages/iot-app-kit-visualizations/src/components/sc-size-provider/sc-size-provider.tsx +++ b/packages/iot-app-kit-visualizations/src/components/sc-size-provider/sc-size-provider.tsx @@ -18,7 +18,7 @@ const MS_PER_RECT_POLL = 650; * Widget Sizer */ @Component({ - tag: 'sc-size-provider', + tag: 'iot-app-kit-vis-size-provider', styleUrl: 'sc-size-provider.css', shadow: false, }) diff --git a/packages/iot-app-kit-visualizations/src/components/sc-webgl-context/sc-webgl-context.css b/packages/iot-app-kit-visualizations/src/components/sc-webgl-context/sc-webgl-context.css index caa0b9e36..bd7b32275 100644 --- a/packages/iot-app-kit-visualizations/src/components/sc-webgl-context/sc-webgl-context.css +++ b/packages/iot-app-kit-visualizations/src/components/sc-webgl-context/sc-webgl-context.css @@ -1,4 +1,4 @@ -sc-webgl-context { +iot-app-kit-vis-webgl-context { --scroll-bar-size: 16px; width: 100%; diff --git a/packages/iot-app-kit-visualizations/src/components/sc-webgl-context/sc-webgl-context.tsx b/packages/iot-app-kit-visualizations/src/components/sc-webgl-context/sc-webgl-context.tsx index 7167b2ee5..3a0490269 100644 --- a/packages/iot-app-kit-visualizations/src/components/sc-webgl-context/sc-webgl-context.tsx +++ b/packages/iot-app-kit-visualizations/src/components/sc-webgl-context/sc-webgl-context.tsx @@ -2,7 +2,7 @@ import { h, Element, Component, Prop } from '@stencil/core'; import { webGLRenderer } from './webglContext'; @Component({ - tag: 'sc-webgl-context', + tag: 'iot-app-kit-vis-webgl-context', styleUrl: 'sc-webgl-context.css', shadow: false, }) diff --git a/packages/iot-app-kit-visualizations/src/index.html b/packages/iot-app-kit-visualizations/src/index.html index d797f7f62..3f25e16ab 100644 --- a/packages/iot-app-kit-visualizations/src/index.html +++ b/packages/iot-app-kit-visualizations/src/index.html @@ -1,32 +1,35 @@ - - - - - IoT Shared Components - - + + + + + IoT Shared Components - - - - - - + + + + + + + + \ No newline at end of file diff --git a/packages/iot-app-kit-visualizations/src/testing/app/app.tsx b/packages/iot-app-kit-visualizations/src/testing/app/app.tsx index 0a31c2d7b..6f2733328 100644 --- a/packages/iot-app-kit-visualizations/src/testing/app/app.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/app/app.tsx @@ -4,7 +4,7 @@ import '@stencil/router'; import { routes } from './routes'; @Component({ - tag: 'sc-app', + tag: 'iot-app-kit-vis-app', }) export class App { render() { diff --git a/packages/iot-app-kit-visualizations/src/testing/app/routes.ts b/packages/iot-app-kit-visualizations/src/testing/app/routes.ts index ef61e5ac5..e42fa95a1 100644 --- a/packages/iot-app-kit-visualizations/src/testing/app/routes.ts +++ b/packages/iot-app-kit-visualizations/src/testing/app/routes.ts @@ -10,287 +10,287 @@ export const routes = [ component: 'testing-ground', }, { - url: '/tests/sc-webgl-context/nested', - component: 'sc-webgl-context-nested', + url: '/tests/webgl-context/nested', + component: 'iot-app-kit-vis-webgl-context-nested', }, { - url: '/tests/sc-webgl-context/root', - component: 'sc-webgl-context-root', + url: '/tests/webgl-context/root', + component: 'iot-app-kit-vis-webgl-context-root', }, { - url: '/tests/sc-webgl-chart/circle-point-shaders', - component: 'sc-circle-point-shaders', + url: '/tests/webgl-chart/circle-point-shaders', + component: 'iot-app-kit-vis-circle-point-shaders', }, { - url: '/tests/sc-webgl-chart/angled-line-segment', - component: 'sc-angled-line-segment', + url: '/tests/webgl-chart/angled-line-segment', + component: 'iot-app-kit-vis-angled-line-segment', }, { - url: '/tests/sc-webgl-chart/single-bar', - component: 'sc-single-bar', + url: '/tests/webgl-chart/single-bar', + component: 'iot-app-kit-vis-single-bar', }, { - url: '/tests/sc-webgl-chart/multiple-bars', - component: 'sc-multiple-bars', + url: '/tests/webgl-chart/multiple-bars', + component: 'iot-app-kit-vis-multiple-bars', }, { - url: '/tests/sc-webgl-chart/single-colored-bar', - component: 'sc-single-colored-bar', + url: '/tests/webgl-chart/single-colored-bar', + component: 'iot-app-kit-vis-single-colored-bar', }, { - url: '/tests/sc-webgl-chart/straight-line-segment-colored', - component: 'sc-straight-line-segment-colored', + url: '/tests/webgl-chart/straight-line-segment-colored', + component: 'iot-app-kit-vis-straight-line-segment-colored', }, { - url: '/tests/sc-webgl-chart/straight-line-segment', - component: 'sc-straight-line-segment', + url: '/tests/webgl-chart/straight-line-segment', + component: 'iot-app-kit-vis-straight-line-segment', }, { - url: '/tests/sc-webgl-chart/line-chart-dynamic-data-streams', - component: 'sc-webgl-line-chart-dynamic-data-streams', + url: '/tests/webgl-chart/line-chart-dynamic-data-streams', + component: 'iot-app-kit-vis-webgl-line-chart-dynamic-data-streams', }, { - url: '/tests/sc-webgl-chart/line-chart-dynamic-buffer', - component: 'sc-webgl-line-chart-dynamic-buffer', + url: '/tests/webgl-chart/line-chart-dynamic-buffer', + component: 'iot-app-kit-vis-webgl-line-chart-dynamic-buffer', }, { - url: '/tests/sc-webgl-chart/line-chart-dynamic-data', - component: 'sc-webgl-line-chart-dynamic-data', + url: '/tests/webgl-chart/line-chart-dynamic-data', + component: 'iot-app-kit-vis-webgl-line-chart-dynamic-data', }, { - url: '/tests/sc-webgl-chart/standard-with-legend', - component: 'sc-webgl-chart-standard-with-legend', + url: '/tests/webgl-chart/standard-with-legend', + component: 'iot-app-kit-vis-webgl-chart-standard-with-legend', }, { - url: '/tests/sc-webgl-chart/standard-with-legend-on-right', - component: 'sc-webgl-chart-standard-with-legend-on-right', + url: '/tests/webgl-chart/standard-with-legend-on-right', + component: 'iot-app-kit-vis-webgl-chart-standard-with-legend-on-right', }, { - url: '/tests/sc-webgl-chart/standard', - component: 'sc-webgl-chart-standard', + url: '/tests/webgl-chart/standard', + component: 'iot-app-kit-vis-webgl-chart-standard', }, { - url: '/tests/sc-webgl-chart/unsupported-data-types', + url: '/tests/webgl-chart/unsupported-data-types', component: 'line-chart-unsupported-data-types', }, { - url: '/tests/sc-webgl-chart/sc-webgl-chart-large-viewport', - component: 'sc-webgl-chart-large-viewport', + url: '/tests/webgl-chart/webgl-chart-large-viewport', + component: 'iot-app-kit-vis-webgl-chart-large-viewport', }, { - url: '/tests/sc-webgl-chart/multi', - component: 'sc-webgl-chart-multi', + url: '/tests/webgl-chart/multi', + component: 'iot-app-kit-vis-webgl-chart-multi', }, { - url: '/tests/sc-scatter-chart/scatter-chart-dynamic-data', - component: 'sc-scatter-chart-dynamic-data', + url: '/tests/scatter-chart/scatter-chart-dynamic-data', + component: 'iot-app-kit-vis-scatter-chart-dynamic-data', }, { - url: '/tests/sc-scatter-chart/trend-line-with-legend', - component: 'sc-scatter-chart-trend-line-with-legend', + url: '/tests/scatter-chart/trend-line-with-legend', + component: 'iot-app-kit-vis-scatter-chart-trend-line-with-legend', }, { - url: '/tests/sc-scatter-chart/trend-line-color-configuration', - component: 'sc-scatter-chart-trend-line-color-configuration', + url: '/tests/scatter-chart/trend-line-color-configuration', + component: 'iot-app-kit-vis-scatter-chart-trend-line-color-configuration', }, { - url: '/tests/sc-webgl-chart/colored-point', - component: 'sc-line-chart-colored-point', + url: '/tests/webgl-chart/colored-point', + component: 'iot-app-kit-vis-line-chart-colored-point', }, { - url: '/tests/sc-webgl-chart/multiple-lines', - component: 'sc-multiple-lines', + url: '/tests/webgl-chart/multiple-lines', + component: 'iot-app-kit-vis-multiple-lines', }, { - url: '/tests/sc-webgl-chart/multiple-lines-overlapping', - component: 'sc-multiple-lines-overlapping', + url: '/tests/webgl-chart/multiple-lines-overlapping', + component: 'iot-app-kit-vis-multiple-lines-overlapping', }, { - url: '/tests/sc-expandable-input/standard', - component: 'sc-expandable-input-standard', + url: '/tests/expandable-input/standard', + component: 'iot-app-kit-vis-expandable-input-standard', }, { - url: '/tests/sc-sizer-provider/sc-size-provider-standard', - component: 'sc-size-provider-standard', + url: '/tests/sizer-provider/size-provider-standard', + component: 'iot-app-kit-vis-size-provider-standard', }, { - url: '/tests/sc-webgl-bar-chart/standard', - component: 'sc-webgl-bar-chart-standard', + url: '/tests/webgl-bar-chart/standard', + component: 'iot-app-kit-vis-webgl-bar-chart-standard', }, { - url: '/tests/sc-webgl-chart/sc-webgl-chart-dynamic-charts', - component: 'sc-webgl-chart-dynamic-charts', + url: '/tests/webgl-chart/webgl-chart-dynamic-charts', + component: 'iot-app-kit-vis-webgl-chart-dynamic-charts', }, { - url: '/tests/sc-webgl-bar-chart/bar-chart-dynamic-data-streams', - component: 'sc-webgl-bar-chart-dynamic-data-streams', + url: '/tests/webgl-bar-chart/bar-chart-dynamic-data-streams', + component: 'iot-app-kit-vis-webgl-bar-chart-dynamic-data-streams', }, { - url: '/tests/sc-webgl-bar-chart/bar-chart-dynamic-data', - component: 'sc-webgl-bar-chart-dynamic-data', + url: '/tests/webgl-bar-chart/bar-chart-dynamic-data', + component: 'iot-app-kit-vis-webgl-bar-chart-dynamic-data', }, { - url: '/tests/sc-webgl-bar-chart/bar-chart-fast-viewport', - component: 'sc-webgl-bar-chart-fast-viewport', + url: '/tests/webgl-bar-chart/bar-chart-fast-viewport', + component: 'iot-app-kit-vis-webgl-bar-chart-fast-viewport', }, { - url: '/tests/sc-webgl-bar-chart/bar-chart-dynamic-buffer', - component: 'sc-webgl-bar-chart-dynamic-buffer', + url: '/tests/webgl-bar-chart/bar-chart-dynamic-buffer', + component: 'iot-app-kit-vis-webgl-bar-chart-dynamic-buffer', }, { - url: '/tests/sc-webgl-bar-chart/negative', - component: 'sc-webgl-bar-chart-negative', + url: '/tests/webgl-bar-chart/negative', + component: 'iot-app-kit-vis-webgl-bar-chart-negative', }, { - url: '/tests/sc-webgl-bar-chart/pos-neg', - component: 'sc-webgl-bar-chart-positive-negative', + url: '/tests/webgl-bar-chart/pos-neg', + component: 'iot-app-kit-vis-webgl-bar-chart-positive-negative', }, { - url: '/tests/sc-webgl-bar-chart/threshold/coloration', - component: 'sc-webgl-bar-chart-threshold-coloration', + url: '/tests/webgl-bar-chart/threshold/coloration', + component: 'iot-app-kit-vis-webgl-bar-chart-threshold-coloration', }, { - url: '/tests/sc-webgl-bar-chart/threshold/coloration-exact-point', - component: 'sc-webgl-bar-chart-threshold-coloration-exact-point', + url: '/tests/webgl-bar-chart/threshold/coloration-exact-point', + component: 'iot-app-kit-vis-webgl-bar-chart-threshold-coloration-exact-point', }, { - url: '/tests/sc-webgl-bar-chart/threshold/coloration-multiple-data-stream', - component: 'sc-webgl-bar-chart-threshold-coloration-multiple-data-stream', + url: '/tests/webgl-bar-chart/threshold/coloration-multiple-data-stream', + component: 'iot-app-kit-vis-webgl-bar-chart-threshold-coloration-multiple-data-stream', }, { - url: '/tests/sc-webgl-bar-chart/threshold/coloration-multiple-thresholds', - component: 'sc-webgl-bar-chart-threshold-coloration-multiple-thresholds', + url: '/tests/webgl-bar-chart/threshold/coloration-multiple-thresholds', + component: 'iot-app-kit-vis-webgl-bar-chart-threshold-coloration-multiple-thresholds', }, { - url: '/tests/sc-webgl-bar-chart/threshold/no-coloration', - component: 'sc-webgl-bar-chart-threshold-no-coloration', + url: '/tests/webgl-bar-chart/threshold/no-coloration', + component: 'iot-app-kit-vis-webgl-bar-chart-threshold-no-coloration', }, { - url: '/tests/sc-webgl-bar-chart/threshold/coloration-band', - component: 'sc-webgl-bar-chart-threshold-coloration-band', + url: '/tests/webgl-bar-chart/threshold/coloration-band', + component: 'iot-app-kit-vis-webgl-bar-chart-threshold-coloration-band', }, { - url: '/tests/sc-webgl-chart/performance/sc-line-chart-stream-data', - component: 'sc-line-chart-stream-data', + url: '/tests/webgl-chart/performance/line-chart-stream-data', + component: 'iot-app-kit-vis-line-chart-stream-data', }, { - url: '/tests/sc-lazily-load/sc-lazily-load-standard', - component: 'sc-lazily-load-standard', + url: '/tests/lazily-load/lazily-load-standard', + component: 'iot-app-kit-vis-lazily-load-standard', }, { - url: '/tests/sc-lazily-load/sc-lazily-load-web-component', - component: 'sc-lazily-load-web-component', + url: '/tests/lazily-load/lazily-load-web-component', + component: 'iot-app-kit-vis-lazily-load-web-component', }, { - url: '/tests/sc-webgl-bar-chart/margin', - component: 'sc-webgl-bar-chart-margin', + url: '/tests/webgl-bar-chart/margin', + component: 'iot-app-kit-vis-webgl-bar-chart-margin', }, { - url: '/tests/sc-webgl-chart/annotations/annotation-editable', - component: 'sc-webgl-chart-annotation-editable', + url: '/tests/webgl-chart/annotations/annotation-editable', + component: 'iot-app-kit-vis-webgl-chart-annotation-editable', }, { - url: '/tests/sc-webgl-chart/annotations/draggable-multi', - component: 'sc-annotations-draggable-multi', + url: '/tests/webgl-chart/annotations/draggable-multi', + component: 'iot-app-kit-vis-annotations-draggable-multi', }, { - url: '/tests/sc-webgl-bar-chart/start-from-zero', - component: 'sc-webgl-bar-chart-start-from-zero', + url: '/tests/webgl-bar-chart/start-from-zero', + component: 'iot-app-kit-vis-webgl-bar-chart-start-from-zero', }, { - url: '/tests/sc-webgl-bar-chart/unsupported-data-types', - component: 'sc-webgl-bar-chart-unsupported-data-types', + url: '/tests/webgl-bar-chart/unsupported-data-types', + component: 'iot-app-kit-vis-webgl-bar-chart-unsupported-data-types', }, { - url: '/tests/sc-webgl-chart/annotations', - component: 'sc-webgl-chart-annotations', + url: '/tests/webgl-chart/annotations', + component: 'iot-app-kit-vis-webgl-chart-annotations', }, { - url: '/tests/sc-webgl-chart/threshold/coloration-split-half', - component: 'sc-webgl-chart-threshold-coloration-split-half', + url: '/tests/webgl-chart/threshold/coloration-split-half', + component: 'iot-app-kit-vis-webgl-chart-threshold-coloration-split-half', }, { - url: '/tests/sc-webgl-chart/threshold/coloration-exact-point', - component: 'sc-webgl-chart-threshold-coloration-exact-point', + url: '/tests/webgl-chart/threshold/coloration-exact-point', + component: 'iot-app-kit-vis-webgl-chart-threshold-coloration-exact-point', }, { - url: '/tests/sc-webgl-chart/threshold/coloration-multiple-data-stream', - component: 'sc-webgl-chart-threshold-coloration-multiple-data-stream', + url: '/tests/webgl-chart/threshold/coloration-multiple-data-stream', + component: 'iot-app-kit-vis-webgl-chart-threshold-coloration-multiple-data-stream', }, { - url: '/tests/sc-webgl-chart/threshold/coloration-multiple-thresholds', - component: 'sc-webgl-chart-threshold-coloration-multiple-thresholds', + url: '/tests/webgl-chart/threshold/coloration-multiple-thresholds', + component: 'iot-app-kit-vis-webgl-chart-threshold-coloration-multiple-thresholds', }, { - url: '/tests/sc-webgl-chart/threshold/coloration-band', - component: 'sc-webgl-chart-threshold-coloration-band', + url: '/tests/webgl-chart/threshold/coloration-band', + component: 'iot-app-kit-vis-webgl-chart-threshold-coloration-band', }, { - url: '/tests/sc-webgl-chart/annotations/always-in-viewport', - component: 'sc-webgl-chart-annotations-always-in-viewport', + url: '/tests/webgl-chart/annotations/always-in-viewport', + component: 'iot-app-kit-vis-webgl-chart-annotations-always-in-viewport', }, { - url: '/tests/sc-webgl-chart/tooltip/multiple-data-streams', - component: 'sc-webgl-chart-tooltip-with-multiple-data-streams', + url: '/tests/webgl-chart/tooltip/multiple-data-streams', + component: 'iot-app-kit-vis-webgl-chart-tooltip-with-multiple-data-streams', }, { - url: '/tests/sc-scatter-chart/tooltip/multiple-data-streams-and-trends', - component: 'sc-scatter-chart-tooltip-with-multiple-data-streams-and-trends', + url: '/tests/scatter-chart/tooltip/multiple-data-streams-and-trends', + component: 'iot-app-kit-vis-scatter-chart-tooltip-with-multiple-data-streams-and-trends', }, { - url: '/tests/sc-scatter-chart/threshold/coloration', - component: 'sc-scatter-chart-threshold', + url: '/tests/scatter-chart/threshold/coloration', + component: 'iot-app-kit-vis-scatter-chart-threshold', }, { - url: '/tests/sc-scatter-chart/threshold/coloration-exact-point', - component: 'sc-scatter-chart-threshold-coloration-exact-point', + url: '/tests/scatter-chart/threshold/coloration-exact-point', + component: 'iot-app-kit-vis-scatter-chart-threshold-coloration-exact-point', }, { - url: '/tests/sc-scatter-chart/threshold/coloration-multiple-data-stream', - component: 'sc-scatter-chart-threshold-coloration-multiple-data-stream', + url: '/tests/scatter-chart/threshold/coloration-multiple-data-stream', + component: 'iot-app-kit-vis-scatter-chart-threshold-coloration-multiple-data-stream', }, { - url: '/tests/sc-scatter-chart/threshold/coloration-multiple-thresholds', - component: 'sc-scatter-chart-threshold-coloration-multiple-thresholds', + url: '/tests/scatter-chart/threshold/coloration-multiple-thresholds', + component: 'iot-app-kit-vis-scatter-chart-threshold-coloration-multiple-thresholds', }, { - url: '/tests/sc-scatter-chart/threshold/coloration-band', - component: 'sc-scatter-chart-threshold-coloration-band', + url: '/tests/scatter-chart/threshold/coloration-band', + component: 'iot-app-kit-vis-scatter-chart-threshold-coloration-band', }, { - url: '/tests/sc-webgl-chart/axis', - component: 'sc-webgl-chart-axis', + url: '/tests/webgl-chart/axis', + component: 'iot-app-kit-vis-webgl-chart-axis', }, { url: '/tests/chart/y-range', - component: 'sc-chart-y-range', + component: 'iot-app-kit-vis-chart-y-range', }, { - url: '/tests/sc-webgl-chart/annotations/no-annotations', - component: 'sc-webgl-chart-no-annotations', + url: '/tests/webgl-chart/annotations/no-annotations', + component: 'iot-app-kit-vis-webgl-chart-no-annotations', }, { - url: '/tests/sc-scatter-chart/threshold/no-coloration', - component: 'sc-scatter-chart-threshold-no-coloration', + url: '/tests/scatter-chart/threshold/no-coloration', + component: 'iot-app-kit-vis-scatter-chart-threshold-no-coloration', }, { - url: '/tests/sc-scatter-chart/unsupported-data-types', - component: 'sc-scatter-chart-unsupported-data-types', + url: '/tests/scatter-chart/unsupported-data-types', + component: 'iot-app-kit-vis-scatter-chart-unsupported-data-types', }, { - url: '/tests/common-components/sc-toggle', - component: 'sc-toggle-test', + url: '/tests/common-components/toggle', + component: 'iot-app-kit-vis-toggle-test', }, { - url: '/tests/sc-webgl-chart/single-status', + url: '/tests/webgl-chart/single-status', component: 'single-status', }, { - url: '/tests/sc-webgl-chart/single-colored-status', + url: '/tests/webgl-chart/single-colored-status', component: 'single-colored-status', }, { - url: '/tests/sc-webgl-chart/multiple-statuses', + url: '/tests/webgl-chart/multiple-statuses', component: 'multiple-statuses', }, { diff --git a/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describeErrorStatus.ts b/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describeErrorStatus.ts index 8b85b5219..8583bc279 100644 --- a/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describeErrorStatus.ts +++ b/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describeErrorStatus.ts @@ -66,7 +66,9 @@ export const describeErrorStatus = (newChartSpecPage: ChartSpecPage) => { dataStreams: [{ ...DATA_STREAM, error: undefined }], }); - const baseChart = chart.querySelector('sc-webgl-base-chart') as HTMLScWebglBaseChartElement; + const baseChart = chart.querySelector( + 'iot-app-kit-vis-webgl-base-chart' + ) as HTMLIotAppKitVisWebglBaseChartElement; if (baseChart.displaysError) { const placeholder = chart.querySelector('[data-test-tag="error-badge-place-holder"]'); expect(placeholder).not.toBeNull(); diff --git a/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describeLegend.tsx b/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describeLegend.tsx index d4f730a2f..b3bc88362 100644 --- a/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describeLegend.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describeLegend.tsx @@ -14,7 +14,7 @@ export const describeLegend = (newChartSpecPage: ChartSpecPage) => { }, }); - const legend = chart.querySelector('sc-legend'); + const legend = chart.querySelector('iot-app-kit-vis-legend'); expect(legend).toBeDefined(); }); @@ -27,7 +27,7 @@ export const describeLegend = (newChartSpecPage: ChartSpecPage) => { isEditing: true, }); - const legend = chart.querySelector('sc-legend'); + const legend = chart.querySelector('iot-app-kit-vis-legend'); expect(legend).toHaveAttribute('isEditing'); }); @@ -40,7 +40,7 @@ export const describeLegend = (newChartSpecPage: ChartSpecPage) => { viewport: VIEWPORT, }); - const legend = chart.querySelector('sc-legend') as HTMLScLegendElement; + const legend = chart.querySelector('iot-app-kit-vis-legend') as HTMLIotAppKitVisLegendElement; expect(legend.viewport).toMatchObject({ start: VIEWPORT.start, end: VIEWPORT.end }); }); @@ -70,7 +70,7 @@ export const describeLegend = (newChartSpecPage: ChartSpecPage) => { }, }); - const legend = chart.querySelector('sc-legend') as HTMLScLegendElement; + const legend = chart.querySelector('iot-app-kit-vis-legend') as HTMLIotAppKitVisLegendElement; expect(legend.thresholds).toEqual(THRESHOLDS); }); diff --git a/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describeLoadingStatus.ts b/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describeLoadingStatus.ts index 9863a447f..1ad93e6bf 100644 --- a/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describeLoadingStatus.ts +++ b/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describeLoadingStatus.ts @@ -28,7 +28,7 @@ export const describeLoadingStatus = (newChartSpecPage: ChartSpecPage) => { }); const loadingSpinner = chart.querySelector(LOADING_SPINNER_SELECTOR); - const legend = chart.querySelector('sc-legend'); + const legend = chart.querySelector('iot-app-kit-vis-legend'); if (legend) { // not all widgets have legends! @@ -43,7 +43,7 @@ export const describeLoadingStatus = (newChartSpecPage: ChartSpecPage) => { }); const loadingSpinner = chart.querySelector(LOADING_SPINNER_SELECTOR); - const legend = chart.querySelector('sc-legend'); + const legend = chart.querySelector('iot-app-kit-vis-legend'); if (legend) { // not all widgets have legends! @@ -59,7 +59,7 @@ export const describeLoadingStatus = (newChartSpecPage: ChartSpecPage) => { const loadingSpinner = chart.querySelector(LOADING_SPINNER_SELECTOR); - const legend = chart.querySelector('sc-legend'); + const legend = chart.querySelector('iot-app-kit-vis-legend'); if (legend) { // not all widgets have legends! diff --git a/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describePassedInProps.tsx b/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describePassedInProps.tsx index ee9792a94..17b990463 100644 --- a/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describePassedInProps.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describePassedInProps.tsx @@ -11,7 +11,9 @@ export const describePassedInProps = (newChartSpecPage: ChartSpecPage, disableLi it('passes down', async () => { const alarms = { expires: HOUR_IN_MS }; const { chart } = await newChartSpecPage({ alarms }); - const baseChart = chart.querySelector('sc-webgl-base-chart') as HTMLScWebglBaseChartElement; + const baseChart = chart.querySelector( + 'iot-app-kit-vis-webgl-base-chart' + ) as HTMLIotAppKitVisWebglBaseChartElement; expect(baseChart.alarms).toBe(alarms); }); @@ -21,7 +23,9 @@ export const describePassedInProps = (newChartSpecPage: ChartSpecPage, disableLi it('passes down', async () => { const messageOverrides = { noDataStreamsPresentHeader: 'an over ride message' }; const { chart } = await newChartSpecPage({ messageOverrides }); - const baseChart = chart.querySelector('sc-webgl-base-chart') as HTMLScWebglBaseChartElement; + const baseChart = chart.querySelector( + 'iot-app-kit-vis-webgl-base-chart' + ) as HTMLIotAppKitVisWebglBaseChartElement; expect(baseChart.messageOverrides).toBe(messageOverrides); }); @@ -30,14 +34,18 @@ export const describePassedInProps = (newChartSpecPage: ChartSpecPage, disableLi describe('gestures', () => { it('passes gestures down as true', async () => { const { chart } = await newChartSpecPage({ gestures: true }); - const baseChart = chart.querySelector('sc-webgl-base-chart') as HTMLScWebglBaseChartElement; + const baseChart = chart.querySelector( + 'iot-app-kit-vis-webgl-base-chart' + ) as HTMLIotAppKitVisWebglBaseChartElement; expect(baseChart.gestures).toBeTrue(); }); it('passes gestures down as false', async () => { const { chart } = await newChartSpecPage({ gestures: false }); - const baseChart = chart.querySelector('sc-webgl-base-chart') as HTMLScWebglBaseChartElement; + const baseChart = chart.querySelector( + 'iot-app-kit-vis-webgl-base-chart' + ) as HTMLIotAppKitVisWebglBaseChartElement; expect(baseChart.gestures).toBeFalse(); }); @@ -46,7 +54,9 @@ export const describePassedInProps = (newChartSpecPage: ChartSpecPage, disableLi describe('supports strings', () => { it('sets the provided option supportsStrings', async () => { const { chart } = await newChartSpecPage({}); - const baseChart = chart.querySelector('sc-webgl-base-chart') as HTMLScWebglBaseChartElement; + const baseChart = chart.querySelector( + 'iot-app-kit-vis-webgl-base-chart' + ) as HTMLIotAppKitVisWebglBaseChartElement; expect(baseChart.supportString).toBeDefined(); }); @@ -61,7 +71,9 @@ export const describePassedInProps = (newChartSpecPage: ChartSpecPage, disableLi }; const { chart } = await newChartSpecPage({ viewport: VIEWPORT }); - const baseChart = chart.querySelector('sc-webgl-base-chart') as HTMLScWebglBaseChartElement; + const baseChart = chart.querySelector( + 'iot-app-kit-vis-webgl-base-chart' + ) as HTMLIotAppKitVisWebglBaseChartElement; /** Start and end date is equal to what was provided */ expect(baseChart.viewport).toEqual(expect.objectContaining(VIEWPORT)); @@ -82,7 +94,9 @@ export const describePassedInProps = (newChartSpecPage: ChartSpecPage, disableLi }; const { chart } = await newChartSpecPage({ legend: LEGEND }); - const baseChart = chart.querySelector('sc-webgl-base-chart') as HTMLScWebglBaseChartElement; + const baseChart = chart.querySelector( + 'iot-app-kit-vis-webgl-base-chart' + ) as HTMLIotAppKitVisWebglBaseChartElement; expect(baseChart.legend).toEqual(LEGEND); }); @@ -100,7 +114,9 @@ export const describePassedInProps = (newChartSpecPage: ChartSpecPage, disableLi ]; const { chart } = await newChartSpecPage({ trends: TRENDS }); - const baseChart = chart.querySelector('sc-webgl-base-chart') as HTMLScWebglBaseChartElement; + const baseChart = chart.querySelector( + 'iot-app-kit-vis-webgl-base-chart' + ) as HTMLIotAppKitVisWebglBaseChartElement; expect(baseChart.trends).toEqual(TRENDS); }); @@ -120,7 +136,9 @@ export const describePassedInProps = (newChartSpecPage: ChartSpecPage, disableLi }; const { chart } = await newChartSpecPage({ annotations: ANNOTATIONS }); - const baseChart = chart.querySelector('sc-webgl-base-chart') as HTMLScWebglBaseChartElement; + const baseChart = chart.querySelector( + 'iot-app-kit-vis-webgl-base-chart' + ) as HTMLIotAppKitVisWebglBaseChartElement; expect(baseChart.annotations).toEqual(ANNOTATIONS); }); @@ -135,7 +153,9 @@ export const describePassedInProps = (newChartSpecPage: ChartSpecPage, disableLi }; const { chart } = await newChartSpecPage({ axis: AXIS }); - const baseChart = chart.querySelector('sc-webgl-base-chart') as HTMLScWebglBaseChartElement; + const baseChart = chart.querySelector( + 'iot-app-kit-vis-webgl-base-chart' + ) as HTMLIotAppKitVisWebglBaseChartElement; expect(baseChart.axis).toEqual(AXIS); }); diff --git a/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describeYRange.ts b/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describeYRange.ts index 78c18001d..ba31a4c34 100644 --- a/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describeYRange.ts +++ b/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/describeYRange.ts @@ -7,7 +7,9 @@ export const describeYRange = (newChartSpecPage: ChartSpecPage) => { it('sets the provided viewport', async () => { const { chart } = await newChartSpecPage({ viewport: VIEWPORT }); - const baseChart = chart.querySelector('sc-webgl-base-chart') as HTMLScWebglBaseChartElement; + const baseChart = chart.querySelector( + 'iot-app-kit-vis-webgl-base-chart' + ) as HTMLIotAppKitVisWebglBaseChartElement; expect(baseChart.viewport.yMin).toBe(VIEWPORT.yMin); expect(baseChart.viewport.yMax).toBe(VIEWPORT.yMax); @@ -31,7 +33,9 @@ export const describeYRange = (newChartSpecPage: ChartSpecPage) => { }, }); - const baseChart = chart.querySelector('sc-webgl-base-chart') as HTMLScWebglBaseChartElement; + const baseChart = chart.querySelector( + 'iot-app-kit-vis-webgl-base-chart' + ) as HTMLIotAppKitVisWebglBaseChartElement; expect(baseChart.viewport.yMin).toBeLessThanOrEqual(SMALL_Y); expect(baseChart.viewport.yMax).toBeGreaterThanOrEqual(LARGE_Y); @@ -51,7 +55,9 @@ export const describeYRange = (newChartSpecPage: ChartSpecPage) => { }, }); - const baseChart = chart.querySelector('sc-webgl-base-chart') as HTMLScWebglBaseChartElement; + const baseChart = chart.querySelector( + 'iot-app-kit-vis-webgl-base-chart' + ) as HTMLIotAppKitVisWebglBaseChartElement; expect(baseChart.viewport.yMin).toBe(VIEWPORT.yMin); expect(baseChart.viewport.yMax).toBe(VIEWPORT.yMax); diff --git a/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/newChartSpecPage.ts b/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/newChartSpecPage.ts index 4c928ad93..6d893eea9 100644 --- a/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/newChartSpecPage.ts +++ b/packages/iot-app-kit-visualizations/src/testing/chartDescriptions/newChartSpecPage.ts @@ -21,7 +21,7 @@ import { ScChartIcon } from '../../components/charts/chart-icon/sc-chart-icon'; const VIEWPORT = { start: new Date(2000), end: new Date(2001, 0, 0), yMin: 0, yMax: 100 }; -export type ChartProps = Components.ScLineChart; +export type ChartProps = Components.IotAppKitVisLineChart; export type ChartSpecPage = (props: Partial) => Promise<{ page: SpecPage; chart: HTMLElement }>; diff --git a/packages/iot-app-kit-visualizations/src/testing/dynamicWidgetUtils/testCaseParameters.ts b/packages/iot-app-kit-visualizations/src/testing/dynamicWidgetUtils/testCaseParameters.ts index 1fe475490..32a99c03f 100644 --- a/packages/iot-app-kit-visualizations/src/testing/dynamicWidgetUtils/testCaseParameters.ts +++ b/packages/iot-app-kit-visualizations/src/testing/dynamicWidgetUtils/testCaseParameters.ts @@ -118,7 +118,7 @@ export const testCaseParameters = (): SearchQueryParams => { tableColumns: query.tableColumns != null ? JSON.parse(query.tableColumns) : [], legend: query.legend != null ? JSON.parse(query.legend) : LEGEND, // set this to undefined messageOverrides: query.messageOverrides != null ? JSON.parse(query.messageOverrides) : undefined, - componentTag: query.componentTag != null ? query.componentTag : 'sc-line-chart', + componentTag: query.componentTag != null ? query.componentTag : 'iot-app-kit-vis-line-chart', // deserialize fields that require it. displayInfoNames: query.displayInfoNames ? parseBool(query.displayInfoNames) : false, annotations: query.annotations != null ? deserializeAnnotations(query.annotations) : undefined, diff --git a/packages/iot-app-kit-visualizations/src/testing/selectors.ts b/packages/iot-app-kit-visualizations/src/testing/selectors.ts index 90590aee9..40e4bcce5 100644 --- a/packages/iot-app-kit-visualizations/src/testing/selectors.ts +++ b/packages/iot-app-kit-visualizations/src/testing/selectors.ts @@ -13,16 +13,16 @@ import { DataStreamId } from '../utils/dataTypes'; // NOTE: the values of the selectors will change over time. export const ERROR_SYMBOL_SELECTOR = '[data-test-tag="error"]'; -export const LOADING_SPINNER_SELECTOR = 'sc-loading-spinner'; -export const CHART_VIZ_CONTAINER_SELECTOR = 'sc-webgl-base-chart .data-container'; -export const DATA_TYPE_ERROR_CONTAINER_SELECTOR = 'sc-webgl-base-chart .unsupported-data-type-status'; -export const CHART_TOOLTIP_SELECTOR = 'sc-webgl-base-chart .tooltip-container'; -export const CHART_TOOLTIP_ROW_SELECTOR = 'sc-tooltip-row'; -export const LEGEND_SELECTOR = 'sc-legend'; +export const LOADING_SPINNER_SELECTOR = 'iot-app-kit-vis-loading-spinner'; +export const CHART_VIZ_CONTAINER_SELECTOR = 'iot-app-kit-vis-webgl-base-chart .data-container'; +export const DATA_TYPE_ERROR_CONTAINER_SELECTOR = 'iot-app-kit-vis-webgl-base-chart .unsupported-data-type-status'; +export const CHART_TOOLTIP_SELECTOR = 'iot-app-kit-vis-webgl-base-chart .tooltip-container'; +export const CHART_TOOLTIP_ROW_SELECTOR = 'iot-app-kit-vis-tooltip-row'; +export const LEGEND_SELECTOR = 'iot-app-kit-vis-legend'; // corresponds to the 'no data visualization', and the 'data stream name and value' panel directly above it. -export const STATUS_TIMELINE_OVERLAY_SELECTOR = 'sc-status-timeline-overlay'; -export const STATUS_TIMELINE_OVERLAY_ROW_SELECTOR = 'sc-status-timeline-overlay-row'; +export const STATUS_TIMELINE_OVERLAY_SELECTOR = 'iot-app-kit-vis-status-timeline-overlay'; +export const STATUS_TIMELINE_OVERLAY_ROW_SELECTOR = 'iot-app-kit-vis-status-timeline-overlay-row'; export const NO_VALUE_PRESENT_SELECTOR = '[data-testid="no-value-present"]'; // Helps prevent DOM shift issues due to `size-provider` diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/line-chart-viewport-change.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/line-chart-viewport-change.tsx index 0eb52891c..ee6af3b96 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/line-chart-viewport-change.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/line-chart-viewport-change.tsx @@ -51,9 +51,9 @@ export class LineChartViewportChange {

- +
- +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/performance/sc-line-chart-stream-data.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/performance/sc-line-chart-stream-data.tsx index 01f6dfb5a..3ca2d2815 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/performance/sc-line-chart-stream-data.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/performance/sc-line-chart-stream-data.tsx @@ -31,7 +31,7 @@ const createData = (point: DataPoint): DataPoint[] => })); @Component({ - tag: 'sc-line-chart-stream-data', + tag: 'iot-app-kit-vis-line-chart-stream-data', }) export class ScLineChartStreamData { @State() dataPoints: DataPoint[] = [TEST_DATA_POINT]; @@ -75,7 +75,7 @@ export class ScLineChartStreamData { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-annotations-draggable-multi.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-annotations-draggable-multi.tsx index 1a5f2b599..432e9ef49 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-annotations-draggable-multi.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-annotations-draggable-multi.tsx @@ -37,14 +37,14 @@ const SIZE = { }; @Component({ - tag: 'sc-annotations-draggable-multi', + tag: 'iot-app-kit-vis-annotations-draggable-multi', }) export class ScAnnotationsDraggableMulti { render() { return (
-
-
- +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-chart-y-range.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-chart-y-range.tsx index 03e38be5e..1ddca9baa 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-chart-y-range.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-chart-y-range.tsx @@ -4,7 +4,7 @@ import { MONTH_IN_MS } from '../../../utils/time'; import { DataType } from '../../../utils/dataConstants'; const urlParams = new URLSearchParams(window.location.search); -const componentTag = urlParams.get('componentTag') || 'sc-line-chart'; +const componentTag = urlParams.get('componentTag') || 'iot-app-kit-vis-line-chart'; // viewport boundaries const X_MIN = new Date(2000, 0, 0); @@ -52,7 +52,7 @@ const data: DataStream[] = [ ]; @Component({ - tag: 'sc-chart-y-range', + tag: 'iot-app-kit-vis-chart-y-range', }) export class ScChartYRange { @Prop() component: string = componentTag; @@ -69,7 +69,7 @@ export class ScChartYRange { }} viewport={{ start: X_MIN, end: X_MAX }} /> - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-bar-margin.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-bar-margin.tsx index c52eb0462..7e41f948c 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-bar-margin.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-bar-margin.tsx @@ -50,7 +50,7 @@ const DATA_STREAM_2: DataStream = { }; @Component({ - tag: 'sc-webgl-bar-chart-margin', + tag: 'iot-app-kit-vis-webgl-bar-chart-margin', }) export class ScWebglBarChartDynamicBuffer { @State() data: DataPoint[] = []; @@ -58,14 +58,14 @@ export class ScWebglBarChartDynamicBuffer { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-dynamic-buffer.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-dynamic-buffer.tsx index 7ca361689..c44a39824 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-dynamic-buffer.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-dynamic-buffer.tsx @@ -18,7 +18,7 @@ const X_MAX = new Date(2000, 0, 1); const WIDTH = X_MAX.getTime() - X_MIN.getTime(); @Component({ - tag: 'sc-webgl-bar-chart-dynamic-buffer', + tag: 'iot-app-kit-vis-webgl-bar-chart-dynamic-buffer', }) export class ScWebglBarChartDynamicBuffer { @State() data: DataPoint[] = []; @@ -39,7 +39,7 @@ export class ScWebglBarChartDynamicBuffer { Add Data Point
- - +
); diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-dynamic-data-streams.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-dynamic-data-streams.tsx index 7cf41f4f8..389992c9d 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-dynamic-data-streams.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-dynamic-data-streams.tsx @@ -20,7 +20,7 @@ const RIGHT_X = new Date(2000, 9).getTime(); */ @Component({ - tag: 'sc-webgl-bar-chart-dynamic-data-streams', + tag: 'iot-app-kit-vis-webgl-bar-chart-dynamic-data-streams', }) export class ScWebglBarChartDynamicDataStreams { @State() dataStreams: DataStream[] = []; @@ -87,7 +87,7 @@ export class ScWebglBarChartDynamicDataStreams {

-
- + ); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-dynamic-data.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-dynamic-data.tsx index 6ecd38048..e7369e0bc 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-dynamic-data.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-dynamic-data.tsx @@ -18,7 +18,7 @@ const X_MAX = new Date(2001, 12); */ @Component({ - tag: 'sc-webgl-bar-chart-dynamic-data', + tag: 'iot-app-kit-vis-webgl-bar-chart-dynamic-data', }) export class ScWebglBarChartDynamicData { @State() data: DataPoint[] = []; @@ -51,7 +51,7 @@ export class ScWebglBarChartDynamicData {

- - +
); diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-fast-viewport.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-fast-viewport.tsx index 9ee6d0c17..cf6dbe8c0 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-fast-viewport.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-fast-viewport.tsx @@ -23,7 +23,7 @@ const TEST_DATA_POINTS: DataPoint[] = Array.from({ length: 50 }, (_, ind */ @Component({ - tag: 'sc-webgl-bar-chart-fast-viewport', + tag: 'iot-app-kit-vis-webgl-bar-chart-fast-viewport', }) export class ScWebglBarChartFastViewport { @State() dataStreams: DataStream[] = []; @@ -56,7 +56,7 @@ export class ScWebglBarChartFastViewport {

- - +
); diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-negative.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-negative.tsx index d53486bbb..d5becae4a 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-negative.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-negative.tsx @@ -23,13 +23,13 @@ const TEST_DATA_POINT: DataPoint = { */ @Component({ - tag: 'sc-webgl-bar-chart-negative', + tag: 'iot-app-kit-vis-webgl-bar-chart-negative', }) export class ScWebglBarChartNegative { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-positive-negative.component.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-positive-negative.component.tsx index e3d6fde76..06aeead47 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-positive-negative.component.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-positive-negative.component.tsx @@ -28,13 +28,13 @@ const TEST_DATA_POINT_2: DataPoint = { */ @Component({ - tag: 'sc-webgl-bar-chart-positive-negative', + tag: 'iot-app-kit-vis-webgl-bar-chart-positive-negative', }) export class ScWebglBarChartPositiveNegative { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-standard.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-standard.tsx index 5571c13d4..17cdc48a7 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-standard.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-standard.tsx @@ -12,13 +12,13 @@ import { DataType } from '../../../../utils/dataConstants'; */ @Component({ - tag: 'sc-webgl-bar-chart-standard', + tag: 'iot-app-kit-vis-webgl-bar-chart-standard', }) export class ScWebglBarChartStandard { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-start-from-zero.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-start-from-zero.tsx index b26671433..ed4b3da87 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-start-from-zero.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-start-from-zero.tsx @@ -14,7 +14,7 @@ const X_MAX = new Date(2000, 0, 0, 0, 10); */ @Component({ - tag: 'sc-webgl-bar-chart-start-from-zero', + tag: 'iot-app-kit-vis-webgl-bar-chart-start-from-zero', }) export class ScWebglBarChartStartFromZero { @State() testData: DataPoint[] = [ @@ -42,7 +42,7 @@ export class ScWebglBarChartStartFromZero {

- - +
); diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-band.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-band.tsx index 85a343f1a..32e5ebcb0 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-band.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-band.tsx @@ -12,13 +12,13 @@ import { DataType } from '../../../../utils/dataConstants'; */ @Component({ - tag: 'sc-webgl-bar-chart-threshold-coloration-band', + tag: 'iot-app-kit-vis-webgl-bar-chart-threshold-coloration-band', }) export class ScWebglBarChartThresholdBand { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-coloration.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-coloration.tsx index b5ddf497e..f95896523 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-coloration.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-coloration.tsx @@ -13,13 +13,13 @@ import { DataType } from '../../../../utils/dataConstants'; */ @Component({ - tag: 'sc-webgl-bar-chart-threshold-coloration', + tag: 'iot-app-kit-vis-webgl-bar-chart-threshold-coloration', }) export class ScWebglBarChartThresholdColoration { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-exact-point.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-exact-point.tsx index ad5ad7297..e6964f514 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-exact-point.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-exact-point.tsx @@ -11,13 +11,13 @@ import { DataType } from '../../../../utils/dataConstants'; */ @Component({ - tag: 'sc-webgl-bar-chart-threshold-coloration-exact-point', + tag: 'iot-app-kit-vis-webgl-bar-chart-threshold-coloration-exact-point', }) export class ScWebglBarChartThresholdExactPoint { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-multiple-data-stream.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-multiple-data-stream.tsx index 3b5040952..695317353 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-multiple-data-stream.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-multiple-data-stream.tsx @@ -36,13 +36,13 @@ const TEST_2_DATA_POINT_2: DataPoint = { * */ @Component({ - tag: 'sc-webgl-bar-chart-threshold-coloration-multiple-data-stream', + tag: 'iot-app-kit-vis-webgl-bar-chart-threshold-coloration-multiple-data-stream', }) export class ScWebglBarChartThresholdMultipleDataStream { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-multiple-thresholds.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-multiple-thresholds.tsx index 1bbdcd354..0eec0263b 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-multiple-thresholds.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-multiple-thresholds.tsx @@ -13,13 +13,13 @@ import { DataType } from '../../../../utils/dataConstants'; */ @Component({ - tag: 'sc-webgl-bar-chart-threshold-coloration-multiple-thresholds', + tag: 'iot-app-kit-vis-webgl-bar-chart-threshold-coloration-multiple-thresholds', }) export class ScWebglBarChartThresholdMultipleThresholds { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-no-coloration.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-no-coloration.tsx index 99213b43d..b6f372781 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-no-coloration.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-threshold-no-coloration.tsx @@ -13,13 +13,13 @@ import { DataType } from '../../../../utils/dataConstants'; */ @Component({ - tag: 'sc-webgl-bar-chart-threshold-no-coloration', + tag: 'iot-app-kit-vis-webgl-bar-chart-threshold-no-coloration', }) export class ScWebglBarChartThresholdNoColoration { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-unsupported-data-types.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-unsupported-data-types.tsx index 0a12498bc..c1ac0afad 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-unsupported-data-types.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-bar-chart/sc-webgl-bar-chart-unsupported-data-types.tsx @@ -20,14 +20,14 @@ const RIGHT_X = new Date(2000, 9).getTime(); */ @Component({ - tag: 'sc-webgl-bar-chart-unsupported-data-types', + tag: 'iot-app-kit-vis-webgl-bar-chart-unsupported-data-types', }) export class ScWebglBarChartUnsupportedDataTypes { render() { return (
-
- +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-annotation-editable.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-annotation-editable.tsx index 444b15284..5c21eef8b 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-annotation-editable.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-annotation-editable.tsx @@ -57,7 +57,7 @@ const Y_ANNOTATION: YAnnotation = { let oldAnnotations: Annotations | undefined; @Component({ - tag: 'sc-webgl-chart-annotation-editable', + tag: 'iot-app-kit-vis-webgl-chart-annotation-editable', }) export class ScWebglChartAnnotationRescaling { @State() isEditableValue: boolean = false; @@ -156,7 +156,7 @@ export class ScWebglChartAnnotationRescaling {
- - +
); diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-annotations-always-in-viewport.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-annotations-always-in-viewport.tsx index 9333fb561..0ad85c71b 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-annotations-always-in-viewport.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-annotations-always-in-viewport.tsx @@ -15,13 +15,13 @@ const TEST_DATA_POINT: DataPoint = { }; @Component({ - tag: 'sc-webgl-chart-annotations-always-in-viewport', + tag: 'iot-app-kit-vis-webgl-chart-annotations-always-in-viewport', }) export class ScWebglChartAnnotationsAlwaysInViewport { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-annotations.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-annotations.tsx index 9dd4ed645..ce767bee8 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-annotations.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-annotations.tsx @@ -15,13 +15,13 @@ const TEST_DATA_POINT: DataPoint = { }; @Component({ - tag: 'sc-webgl-chart-annotations', + tag: 'iot-app-kit-vis-webgl-chart-annotations', }) export class ScWebglChartAnnotations { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-axis.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-axis.tsx index 0891b7b4b..3a9d46f12 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-axis.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-axis.tsx @@ -2,13 +2,13 @@ import { Component, h } from '@stencil/core'; import { Y_MAX, Y_MIN, X_MIN, X_MAX } from './constants'; @Component({ - tag: 'sc-webgl-chart-axis', + tag: 'iot-app-kit-vis-webgl-chart-axis', }) export class ScWebglChartAnnotations { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-dynamic-charts.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-dynamic-charts.tsx index e15a0401d..8d909eaa3 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-dynamic-charts.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-dynamic-charts.tsx @@ -28,7 +28,7 @@ const createData = (point: DataPoint, numPoints: number): DataPoint (
-
))} - + ); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-large-viewport.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-large-viewport.tsx index ae6173c77..e22bee592 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-large-viewport.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-large-viewport.tsx @@ -21,13 +21,13 @@ const TEST_DATA_POINT: DataPoint = { */ @Component({ - tag: 'sc-webgl-chart-large-viewport', + tag: 'iot-app-kit-vis-webgl-chart-large-viewport', }) export class ScWebglChartLargeViewport { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-multi.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-multi.tsx index da61b531d..dcf89a5fb 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-multi.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-multi.tsx @@ -23,13 +23,13 @@ const TEST_DATA_POINT: DataPoint = { */ @Component({ - tag: 'sc-webgl-chart-multi', + tag: 'iot-app-kit-vis-webgl-chart-multi', }) export class ScWebglChartMulti { render() { return (
- - - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-no-annotations.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-no-annotations.tsx index 0da2292ba..fb780f602 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-no-annotations.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-no-annotations.tsx @@ -2,13 +2,13 @@ import { Component, h } from '@stencil/core'; import { Y_MAX, Y_MIN, X_MIN, X_MAX } from './constants'; @Component({ - tag: 'sc-webgl-chart-no-annotations', + tag: 'iot-app-kit-vis-webgl-chart-no-annotations', }) export class ScWebglChartNoAnnotations { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-standard-with-legend-on-right.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-standard-with-legend-on-right.tsx index 6966f5e40..5ff2ea3a1 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-standard-with-legend-on-right.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-standard-with-legend-on-right.tsx @@ -16,13 +16,13 @@ const TEST_DATA_POINT: DataPoint = { }; @Component({ - tag: 'sc-webgl-chart-standard-with-legend-on-right', + tag: 'iot-app-kit-vis-webgl-chart-standard-with-legend-on-right', }) export class ScWebglChartStandardWithLegendOnRight { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-standard-with-legend.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-standard-with-legend.tsx index 00d2a6767..5651044e0 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-standard-with-legend.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-standard-with-legend.tsx @@ -16,13 +16,13 @@ const TEST_DATA_POINT: DataPoint = { }; @Component({ - tag: 'sc-webgl-chart-standard-with-legend', + tag: 'iot-app-kit-vis-webgl-chart-standard-with-legend', }) export class ScWebglChartStandardWithLegend { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-standard.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-standard.tsx index c13e53041..eb570e9de 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-standard.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-standard.tsx @@ -21,13 +21,13 @@ const TEST_DATA_POINT: DataPoint = { */ @Component({ - tag: 'sc-webgl-chart-standard', + tag: 'iot-app-kit-vis-webgl-chart-standard', }) export class ScWebglChartStandard { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration-band.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration-band.tsx index ee728b72d..561d0369b 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration-band.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration-band.tsx @@ -31,13 +31,13 @@ const TEST_2_DATA_POINT_2: DataPoint = { }; @Component({ - tag: 'sc-webgl-chart-threshold-coloration-band', + tag: 'iot-app-kit-vis-webgl-chart-threshold-coloration-band', }) export class ScWebglThresholdColorationBand { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration-exact-point.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration-exact-point.tsx index d0d3a3732..0f0c226c3 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration-exact-point.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration-exact-point.tsx @@ -23,13 +23,13 @@ const TEST_DATA_POINT_2: DataPoint = { }; @Component({ - tag: 'sc-webgl-chart-threshold-coloration-exact-point', + tag: 'iot-app-kit-vis-webgl-chart-threshold-coloration-exact-point', }) export class ScWebglChartThresholdColorationExactPoint { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration-multiple-data-stream.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration-multiple-data-stream.tsx index 85a4c64eb..abb530e0c 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration-multiple-data-stream.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration-multiple-data-stream.tsx @@ -31,13 +31,13 @@ const TEST_2_DATA_POINT_2: DataPoint = { }; @Component({ - tag: 'sc-webgl-chart-threshold-coloration-multiple-data-stream', + tag: 'iot-app-kit-vis-webgl-chart-threshold-coloration-multiple-data-stream', }) export class ScWebglChartThresholdColorationMultipleDataStream { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration-multiple-thresholds.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration-multiple-thresholds.tsx index 1993e5fa7..569dba1e4 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration-multiple-thresholds.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration-multiple-thresholds.tsx @@ -31,13 +31,13 @@ const TEST_2_DATA_POINT_2: DataPoint = { }; @Component({ - tag: 'sc-webgl-chart-threshold-coloration-multiple-thresholds', + tag: 'iot-app-kit-vis-webgl-chart-threshold-coloration-multiple-thresholds', }) export class ScWebglChartThresholdColorationMultipleThresholds { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration.tsx index b60fd1a18..9a6a095a3 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-threshold-coloration.tsx @@ -21,13 +21,13 @@ const TEST_DATA_POINT_2: DataPoint = { }; @Component({ - tag: 'sc-webgl-chart-threshold-coloration-split-half', + tag: 'iot-app-kit-vis-webgl-chart-threshold-coloration-split-half', }) export class ScWebglChartThresholdColoration { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-tooltip-with-multiple-data-streams.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-tooltip-with-multiple-data-streams.tsx index 5b09bf119..871527f12 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-tooltip-with-multiple-data-streams.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-chart-tooltip-with-multiple-data-streams.tsx @@ -25,13 +25,13 @@ const TEST_DATA_POINT_2: DataPoint = { */ @Component({ - tag: 'sc-webgl-chart-tooltip-with-multiple-data-streams', + tag: 'iot-app-kit-vis-webgl-chart-tooltip-with-multiple-data-streams', }) export class ScWebglChartTooltipWithMultipleDataStreams { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-line-chart-dynamic-buffer.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-line-chart-dynamic-buffer.tsx index 2442017d7..5e52103ce 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-line-chart-dynamic-buffer.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-line-chart-dynamic-buffer.tsx @@ -15,7 +15,7 @@ const X_MAX = new Date(2000, 0, 1); const WIDTH = X_MAX.getTime() - X_MIN.getTime(); @Component({ - tag: 'sc-webgl-line-chart-dynamic-buffer', + tag: 'iot-app-kit-vis-webgl-line-chart-dynamic-buffer', }) export class ScWebglLineChartDynamicBuffer { @State() data: DataPoint[] = []; @@ -36,7 +36,7 @@ export class ScWebglLineChartDynamicBuffer {
- - +
); diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-line-chart-dynamic-data-streams.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-line-chart-dynamic-data-streams.tsx index 225453c26..efe448adf 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-line-chart-dynamic-data-streams.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-line-chart-dynamic-data-streams.tsx @@ -22,7 +22,7 @@ const RIGHT_X = new Date(X_MIN.getTime() + VIEWPORT_WIDTH * (1 / 2)).getTime(); */ @Component({ - tag: 'sc-webgl-line-chart-dynamic-data-streams', + tag: 'iot-app-kit-vis-webgl-line-chart-dynamic-data-streams', }) export class ScWebglLineChartDynamicDataStreams { @State() dataStreams: DataStream[] = []; @@ -74,7 +74,7 @@ export class ScWebglLineChartDynamicDataStreams {

-
- + ); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-line-chart-dynamic-data.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-line-chart-dynamic-data.tsx index 965323d64..807034571 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-line-chart-dynamic-data.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-line-chart-dynamic-data.tsx @@ -19,7 +19,7 @@ const X_MAX = new Date(2000, 0, 1); const WIDTH = X_MAX.getTime() - X_MIN.getTime(); @Component({ - tag: 'sc-webgl-line-chart-dynamic-data', + tag: 'iot-app-kit-vis-webgl-line-chart-dynamic-data', }) export class ScWebglLineChartDynamicData { @State() data: DataPoint[] = []; @@ -48,7 +48,7 @@ export class ScWebglLineChartDynamicData { Remove Data Point
- - +
); diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-line-chart-unsupported-data-types.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-line-chart-unsupported-data-types.tsx index abcf71693..028ea306a 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-line-chart-unsupported-data-types.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-line-chart-unsupported-data-types.tsx @@ -18,7 +18,7 @@ export class LineChartUnsupportedDataTypes { return (
- - +
); diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-dynamic-data.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-dynamic-data.tsx index c242c05c7..f4f5a6ddd 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-dynamic-data.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-dynamic-data.tsx @@ -18,7 +18,7 @@ const WIDTH = X_MAX.getTime() - X_MIN.getTime(); * Used to test the behavior of a scatter chart when adding/removing data points */ @Component({ - tag: 'sc-scatter-chart-dynamic-data', + tag: 'iot-app-kit-vis-scatter-chart-dynamic-data', }) export class ScScatterChartDynamicData { @State() data: DataPoint[] = []; @@ -48,7 +48,7 @@ export class ScScatterChartDynamicData { Remove Data Point
- - +
); diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration-band.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration-band.tsx index c46f2f92e..2df52dbf3 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration-band.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration-band.tsx @@ -38,13 +38,13 @@ const TEST_2_DATA_POINT_2: DataPoint = { }; @Component({ - tag: 'sc-scatter-chart-threshold-coloration-band', + tag: 'iot-app-kit-vis-scatter-chart-threshold-coloration-band', }) export class ScScatterChartThresholdColorationBand { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration-exact-point.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration-exact-point.tsx index 71569a483..942cc0c1b 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration-exact-point.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration-exact-point.tsx @@ -23,13 +23,13 @@ const TEST_DATA_POINT_2: DataPoint = { }; @Component({ - tag: 'sc-scatter-chart-threshold-coloration-exact-point', + tag: 'iot-app-kit-vis-scatter-chart-threshold-coloration-exact-point', }) export class ScScatterChartThresholdColorationExactPoint { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration-multiple-data-stream.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration-multiple-data-stream.tsx index 2733c3430..63b88fbc8 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration-multiple-data-stream.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration-multiple-data-stream.tsx @@ -33,13 +33,13 @@ const TEST_2_DATA_POINT_2: DataPoint = { }; @Component({ - tag: 'sc-scatter-chart-threshold-coloration-multiple-data-stream', + tag: 'iot-app-kit-vis-scatter-chart-threshold-coloration-multiple-data-stream', }) export class ScScatterChartThresholdColorationMultipleDataStream { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration-multiple-thresholds.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration-multiple-thresholds.tsx index 9b56ea89d..3f54d79c5 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration-multiple-thresholds.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration-multiple-thresholds.tsx @@ -38,13 +38,13 @@ const TEST_2_DATA_POINT_2: DataPoint = { }; @Component({ - tag: 'sc-scatter-chart-threshold-coloration-multiple-thresholds', + tag: 'iot-app-kit-vis-scatter-chart-threshold-coloration-multiple-thresholds', }) export class ScWebglChartThresholdColorationMultipleThresholds { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration.tsx index dc6b279c0..7db532749 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-coloration.tsx @@ -21,13 +21,13 @@ const TEST_DATA_POINT_2: DataPoint = { }; @Component({ - tag: 'sc-scatter-chart-threshold', + tag: 'iot-app-kit-vis-scatter-chart-threshold', }) export class ScScatterChartThresholdColoration { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-no-coloration.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-no-coloration.tsx index bf6b9a099..d5a17ec7c 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-no-coloration.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-threshold-no-coloration.tsx @@ -23,13 +23,13 @@ const TEST_DATA_POINT_2: DataPoint = { }; @Component({ - tag: 'sc-scatter-chart-threshold-no-coloration', + tag: 'iot-app-kit-vis-scatter-chart-threshold-no-coloration', }) export class ScScatterChartThresholdNoColoration { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-tooltip-with-multiple-data-streams-and-trends.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-tooltip-with-multiple-data-streams-and-trends.tsx index e4068ad4e..fa9e8b3fc 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-tooltip-with-multiple-data-streams-and-trends.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-tooltip-with-multiple-data-streams-and-trends.tsx @@ -44,13 +44,13 @@ const TEST_DATA_POINTS_2: DataPoint[] = [ */ @Component({ - tag: 'sc-scatter-chart-tooltip-with-multiple-data-streams-and-trends', + tag: 'iot-app-kit-vis-scatter-chart-tooltip-with-multiple-data-streams-and-trends', }) export class ScScatterChartTooltipWithMultipleDataStreamsAndTrends { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-trend-line-color-configuration.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-trend-line-color-configuration.tsx index 7418dcdf9..4c4607931 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-trend-line-color-configuration.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-trend-line-color-configuration.tsx @@ -27,13 +27,13 @@ const TEST_DATA_POINTS: DataPoint[] = [ ]; @Component({ - tag: 'sc-scatter-chart-trend-line-color-configuration', + tag: 'iot-app-kit-vis-scatter-chart-trend-line-color-configuration', }) export class ScScatterChartTrendLineColorConfiguration { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-trend-line-with-legend.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-trend-line-with-legend.tsx index 735e3e01e..56d61bb6d 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-trend-line-with-legend.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-trend-line-with-legend.tsx @@ -27,13 +27,13 @@ const TEST_DATA_POINTS: DataPoint[] = [ ]; @Component({ - tag: 'sc-scatter-chart-trend-line-with-legend', + tag: 'iot-app-kit-vis-scatter-chart-trend-line-with-legend', }) export class ScScatterChartTrendLineWithLegend { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-unsupported-data-types.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-unsupported-data-types.tsx index 542cac249..da3cca73a 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-unsupported-data-types.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/sc-webgl-scatter-chart/sc-scatter-chart-unsupported-data-types.tsx @@ -21,13 +21,13 @@ const TEST_DATA_POINT_2: DataPoint = { }; @Component({ - tag: 'sc-scatter-chart-unsupported-data-types', + tag: 'iot-app-kit-vis-scatter-chart-unsupported-data-types', }) export class ScScatterChartUnsupportedDataTypes { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-angled-line-segment.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-angled-line-segment.tsx index cc921ebaf..19a7acc51 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-angled-line-segment.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-angled-line-segment.tsx @@ -25,7 +25,7 @@ const TEST_DATA_POINT_2: DataPoint = { }; @Component({ - tag: 'sc-angled-line-segment', + tag: 'iot-app-kit-vis-angled-line-segment', }) export class ScAngledLineSegment { @Element() el!: HTMLElement; @@ -68,9 +68,9 @@ export class ScAngledLineSegment { render() { return ( - +
- + ); } } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-bar-chart/sc-multiple-bars.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-bar-chart/sc-multiple-bars.tsx index c73ca0a41..6ef2bea58 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-bar-chart/sc-multiple-bars.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-bar-chart/sc-multiple-bars.tsx @@ -31,7 +31,7 @@ const TEST_DATA_POINT_2: DataPoint = { */ @Component({ - tag: 'sc-multiple-bars', + tag: 'iot-app-kit-vis-multiple-bars', }) export class ScMultipleBars { @Element() el!: HTMLElement; @@ -85,9 +85,9 @@ export class ScMultipleBars { render() { return ( - +
- + ); } } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-bar-chart/sc-single-bar.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-bar-chart/sc-single-bar.tsx index 1c60a0720..5d64738e6 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-bar-chart/sc-single-bar.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-bar-chart/sc-single-bar.tsx @@ -27,7 +27,7 @@ const TEST_DATA_POINT_1: DataPoint = { */ @Component({ - tag: 'sc-single-bar', + tag: 'iot-app-kit-vis-single-bar', }) export class ScSingleBar { @Element() el!: HTMLElement; @@ -73,9 +73,9 @@ export class ScSingleBar { render() { return ( - +
- + ); } } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-bar-chart/sc-single-colored-bar.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-bar-chart/sc-single-colored-bar.tsx index ac8f3e0ed..a30150918 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-bar-chart/sc-single-colored-bar.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-bar-chart/sc-single-colored-bar.tsx @@ -27,7 +27,7 @@ const TEST_DATA_POINT_1: DataPoint = { */ @Component({ - tag: 'sc-single-colored-bar', + tag: 'iot-app-kit-vis-single-colored-bar', }) export class ScSingleColoredBar { @Element() el!: HTMLElement; @@ -73,9 +73,9 @@ export class ScSingleColoredBar { render() { return ( - +
- + ); } } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-circle-point-shaders.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-circle-point-shaders.tsx index 1a1c6af1e..f1f76fc8c 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-circle-point-shaders.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-circle-point-shaders.tsx @@ -22,7 +22,7 @@ const TEST_DATA_POINT: DataPoint = { */ @Component({ - tag: 'sc-circle-point-shaders', + tag: 'iot-app-kit-vis-circle-point-shaders', }) export class ScCirclePointShaders { @Element() el!: HTMLElement; @@ -63,9 +63,9 @@ export class ScCirclePointShaders { render() { return ( - +
- + ); } } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-line-chart-colored-point.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-line-chart-colored-point.tsx index a550a64bd..54c5d3e89 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-line-chart-colored-point.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-line-chart-colored-point.tsx @@ -18,7 +18,7 @@ const TEST_DATA_POINT: DataPoint = { }; @Component({ - tag: 'sc-line-chart-colored-point', + tag: 'iot-app-kit-vis-line-chart-colored-point', }) export class ScLineChartColoredPoint { @Element() el!: HTMLElement; @@ -60,9 +60,9 @@ export class ScLineChartColoredPoint { render() { return ( - +
- + ); } } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-multiple-lines-overlapping.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-multiple-lines-overlapping.tsx index b5af39c65..42c9b6bd3 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-multiple-lines-overlapping.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-multiple-lines-overlapping.tsx @@ -34,7 +34,7 @@ const STREAM_2_POINT_2: DataPoint = { }; @Component({ - tag: 'sc-multiple-lines-overlapping', + tag: 'iot-app-kit-vis-multiple-lines-overlapping', }) export class ScMultipleLinesOverlapping { @Element() el!: HTMLElement; @@ -84,9 +84,9 @@ export class ScMultipleLinesOverlapping { render() { return ( - +
- + ); } } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-multiple-lines.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-multiple-lines.tsx index 8f1dbaf84..c428feca3 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-multiple-lines.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-multiple-lines.tsx @@ -34,7 +34,7 @@ const STREAM_2_POINT_2: DataPoint = { }; @Component({ - tag: 'sc-multiple-lines', + tag: 'iot-app-kit-vis-multiple-lines', }) export class ScMultipleLines { @Element() el!: HTMLElement; @@ -84,9 +84,9 @@ export class ScMultipleLines { render() { return ( - +
- + ); } } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-straight-line-segment-colored.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-straight-line-segment-colored.tsx index fab035296..516094578 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-straight-line-segment-colored.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-straight-line-segment-colored.tsx @@ -28,7 +28,7 @@ const TEST_DATA_POINT_2: DataPoint = { */ @Component({ - tag: 'sc-straight-line-segment-colored', + tag: 'iot-app-kit-vis-straight-line-segment-colored', }) export class ScStraightLineSegment { @Element() el!: HTMLElement; @@ -71,9 +71,9 @@ export class ScStraightLineSegment { render() { return ( - +
- + ); } } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-straight-line-segment.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-straight-line-segment.tsx index e6eb46bb1..b5c245cda 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-straight-line-segment.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/sc-straight-line-segment.tsx @@ -24,7 +24,7 @@ const TEST_DATA_POINT_2: DataPoint = { }; @Component({ - tag: 'sc-straight-line-segment', + tag: 'iot-app-kit-vis-straight-line-segment', }) export class ScStraightLineSegment { @Element() el!: HTMLElement; @@ -66,9 +66,9 @@ export class ScStraightLineSegment { render() { return ( - +
- + ); } } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/status-timeline/multiple-statuses.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/status-timeline/multiple-statuses.tsx index ba1edd606..59af488a4 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/status-timeline/multiple-statuses.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/status-timeline/multiple-statuses.tsx @@ -83,9 +83,9 @@ export class MultipleStatuses { render() { return ( - +
- + ); } } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/status-timeline/single-colored-status.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/status-timeline/single-colored-status.tsx index 4232ae5b4..b22e59e43 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/status-timeline/single-colored-status.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/status-timeline/single-colored-status.tsx @@ -66,9 +66,9 @@ export class SingleColoredStatus { render() { return ( - +
- + ); } } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/status-timeline/single-status.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/status-timeline/single-status.tsx index adb6f7679..d0696bada 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/status-timeline/single-status.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/shaders/status-timeline/single-status.tsx @@ -66,9 +66,9 @@ export class ScSingleStatus { render() { return ( - +
- + ); } } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-dynamic-buffer.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-dynamic-buffer.tsx index 10f5bdad7..24caaf967 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-dynamic-buffer.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-dynamic-buffer.tsx @@ -33,7 +33,7 @@ export class StatusTimelineDynamicBuffer { Add Data Point
- - +
); diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-dynamic-data-streams.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-dynamic-data-streams.tsx index 7a3ccf316..89a9757d3 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-dynamic-data-streams.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-dynamic-data-streams.tsx @@ -82,7 +82,7 @@ export class StatusTimelineDynamicDataStreams {

-
- +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-dynamic-data.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-dynamic-data.tsx index 18c70c3d9..5a711105f 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-dynamic-data.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-dynamic-data.tsx @@ -45,7 +45,7 @@ export class StatusTimelineDynamicData {

- - +
); diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-fast-viewport.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-fast-viewport.tsx index 90ca55a0e..29d1ecf5d 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-fast-viewport.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-fast-viewport.tsx @@ -52,7 +52,7 @@ export class StatusTimelineFastViewport {

- - +
); diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-multiple-data-streams.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-multiple-data-streams.tsx index af8d96f66..2c9655482 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-multiple-data-streams.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-multiple-data-streams.tsx @@ -12,7 +12,7 @@ export class StatusTimelineMultipleDataStreams { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-raw-data.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-raw-data.tsx index e0d7171f8..9b6d60a2c 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-raw-data.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-raw-data.tsx @@ -51,7 +51,7 @@ export class StatusTimelineRawData { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-standard.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-standard.tsx index 22a706253..3d8aa1a40 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-standard.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-standard.tsx @@ -11,7 +11,7 @@ export class StatusTimelineStandard { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-status-margin.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-status-margin.tsx index 0bdc6c2fb..fd413a24c 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-status-margin.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-status-margin.tsx @@ -47,13 +47,13 @@ export class StatusTimelineStatusMargin { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-band.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-band.tsx index 23e228ed9..03aeb800f 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-band.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-band.tsx @@ -30,7 +30,7 @@ export class StatusTimelineThresholdBand { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-coloration.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-coloration.tsx index 928ad6b7d..5694a1736 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-coloration.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-coloration.tsx @@ -13,7 +13,7 @@ export class StatusTimelineThresholdColoration { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-exact-point.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-exact-point.tsx index dc211a2c7..1b24779f7 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-exact-point.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-exact-point.tsx @@ -13,7 +13,7 @@ export class StatusTimelineThresholdExactPoint { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-multiple-data-stream.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-multiple-data-stream.tsx index 69ab4c733..9d9a853ce 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-multiple-data-stream.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-multiple-data-stream.tsx @@ -38,7 +38,7 @@ export class StatusTimelineThresholdMultipleDataStream { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-multiple-thresholds.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-multiple-thresholds.tsx index 7d5e15a57..fb332f163 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-multiple-thresholds.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-multiple-thresholds.tsx @@ -13,7 +13,7 @@ export class StatusTimelineThresholdMultipleThresholds { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-no-coloration.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-no-coloration.tsx index 096929dad..041d688a9 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-no-coloration.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/charts/status-timeline/status-timeline-threshold-no-coloration.tsx @@ -13,7 +13,7 @@ export class StatusTimelineThresholdNoColoration { render() { return (
- - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/sc-expandable-input/sc-expandable-input-standard.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/sc-expandable-input/sc-expandable-input-standard.tsx index d4cbe8a71..71784562f 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/sc-expandable-input/sc-expandable-input-standard.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/sc-expandable-input/sc-expandable-input-standard.tsx @@ -1,7 +1,7 @@ import { Component, h, Host, State } from '@stencil/core'; @Component({ - tag: 'sc-expandable-input-standard', + tag: 'iot-app-kit-vis-expandable-input-standard', }) export class ScExpandableInputStandard { @State() value: string = ''; @@ -9,7 +9,7 @@ export class ScExpandableInputStandard { render() { return ( - { this.value = value; }} diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/sc-size-provider/sc-size-provider-standard.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/sc-size-provider/sc-size-provider-standard.tsx index b1ca9b4df..c7f5f7387 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/sc-size-provider/sc-size-provider-standard.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/sc-size-provider/sc-size-provider-standard.tsx @@ -2,7 +2,7 @@ import { Component, h, State } from '@stencil/core'; import { DEFAULT_SIZE, SHIFT_X_DIFF } from './constants'; @Component({ - tag: 'sc-size-provider-standard', + tag: 'iot-app-kit-vis-size-provider-standard', }) export class ScSizeProviderStandard { @State() marginLeft: number = 0; @@ -27,7 +27,7 @@ export class ScSizeProviderStandard { width: `${DEFAULT_SIZE.width}px`, }} > - } /> + } />
); diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/sc-webgl-context/sc-webgl-context-nested.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/sc-webgl-context/sc-webgl-context-nested.tsx index be10a309c..852d59bc4 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/sc-webgl-context/sc-webgl-context-nested.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/sc-webgl-context/sc-webgl-context-nested.tsx @@ -48,7 +48,7 @@ type ContextPlacement = 'viewport' | 'element'; */ @Component({ - tag: 'sc-webgl-context-nested', + tag: 'iot-app-kit-vis-webgl-context-nested', }) export class ScWebglContextNested { @State() elementRef?: HTMLDivElement; @@ -66,7 +66,7 @@ export class ScWebglContextNested { width: '500px', }} > -
- {this.contextPlacement === 'element' && } + {this.contextPlacement === 'element' && }
{sidePanel}
- {this.contextPlacement === 'viewport' && } + {this.contextPlacement === 'viewport' && }
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/sc-webgl-context/sc-webgl-context-root.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/sc-webgl-context/sc-webgl-context-root.tsx index cfe25cdb1..22184f0d3 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/sc-webgl-context/sc-webgl-context-root.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/sc-webgl-context/sc-webgl-context-root.tsx @@ -36,7 +36,7 @@ const TEST_2DATA_POINT_2: DataPoint = { */ @Component({ - tag: 'sc-webgl-context-root', + tag: 'iot-app-kit-vis-webgl-context-root', }) export class ScWebglContextRoot { render() { @@ -44,7 +44,7 @@ export class ScWebglContextRoot {
-
-
-
- +
); diff --git a/packages/iot-app-kit-visualizations/src/testing/test-routes/widget-test-route.tsx b/packages/iot-app-kit-visualizations/src/testing/test-routes/widget-test-route.tsx index a5b7d7334..9ae04d145 100644 --- a/packages/iot-app-kit-visualizations/src/testing/test-routes/widget-test-route.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/test-routes/widget-test-route.tsx @@ -92,7 +92,7 @@ export class WidgetTestRoute { invalidTagErrorSubheader="invalidComponentTag.subheader" liveModeOnly="invalidWidgetForHistoricalData.content" /> - +
); } diff --git a/packages/iot-app-kit-visualizations/src/testing/testing-ground/sc-box/sc-box.tsx b/packages/iot-app-kit-visualizations/src/testing/testing-ground/sc-box/sc-box.tsx index 5a1e38cd4..0f095c8d7 100755 --- a/packages/iot-app-kit-visualizations/src/testing/testing-ground/sc-box/sc-box.tsx +++ b/packages/iot-app-kit-visualizations/src/testing/testing-ground/sc-box/sc-box.tsx @@ -2,7 +2,7 @@ import { h, Component, Prop } from '@stencil/core'; import { MinimalSizeConfig } from '../../../utils/dataTypes'; @Component({ - tag: 'sc-box', + tag: 'iot-app-kit-vis-box', shadow: false, }) export class ScBox {