@openremote/or-chart 1.11.0-snapshot.20251103144513 → 1.11.0

package/custom-elements-jsx.d.ts

@@ -0,0 +1,269 @@
+
+import type { OrChartEvent, OrChart } from "./lib/index.d.ts";
+
+/**
+ * This type can be used to create scoped tags for your components.
+ *
+ * Usage:
+ *
+ * ```ts
+ * import type { ScopedElements } from "path/to/library/jsx-integration";
+ *
+ * declare module "my-library" {
+ *   namespace JSX {
+ *     interface IntrinsicElements
+ *       extends ScopedElements<'test-', ''> {}
+ *   }
+ * }
+ * ```
+ *
+ * @deprecated Runtime scoped elements result in duplicate types and can confusing for developers. It is recommended to use the `prefix` and `suffix` options to generate new types instead.
+ */
+export type ScopedElements<
+  Prefix extends string = "",
+  Suffix extends string = ""
+> = {
+  [Key in keyof CustomElements as `${Prefix}${Key}${Suffix}`]: CustomElements[Key];
+};
+
+type BaseProps<T extends HTMLElement> = {
+
+  /** Content added between the opening and closing tags of the element */
+  children?: any;
+  /** Used for declaratively styling one or more elements using CSS (Cascading Stylesheets) */
+  class?: string;
+  /** Used for declaratively styling one or more elements using CSS (Cascading Stylesheets) */
+  className?: string;
+  /** Takes an object where the key is the class name(s) and the value is a boolean expression. When true, the class is applied, and when false, it is removed. */
+  classList?: Record<string, boolean | undefined>;
+  /** Specifies the text direction of the element. */
+  dir?: "ltr" | "rtl";
+  /** Contains a space-separated list of the part names of the element that should be exposed on the host element. */
+  exportparts?: string;
+  /** For <label> and <output>, lets you associate the label with some control. */
+  htmlFor?: string;
+  /** Specifies whether the element should be hidden. */
+  hidden?: boolean | string;
+  /** A unique identifier for the element. */
+  id?: string;
+  /** Keys tell React which array item each component corresponds to */
+  key?: string | number;
+  /** Specifies the language of the element. */
+  lang?: string;
+  /** Contains a space-separated list of the part names of the element. Part names allows CSS to select and style specific elements in a shadow tree via the ::part pseudo-element. */
+  part?: string;
+  /** Use the ref attribute with a variable to assign a DOM element to the variable once the element is rendered. */
+  ref?: T | ((e: T) => void);
+  /** Adds a reference for a custom element slot */
+  slot?: string;
+  /** Prop for setting inline styles */
+  style?: Record<string, string | number>;
+  /** Overrides the default Tab button behavior. Avoid using values other than -1 and 0. */
+  tabIndex?: number;
+  /** Specifies the tooltip text for the element. */
+  title?: string;
+  /** Passing 'no' excludes the element content from being translated. */
+  translate?: "yes" | "no";
+  /** The popover global attribute is used to designate an element as a popover element. */
+  popover?: "auto" | "hint" | "manual";
+  /** Turns an element element into a popover control button; takes the ID of the popover element to control as its value. */
+  popovertarget?: "top" | "bottom" | "left" | "right" | "auto";
+  /** Specifies the action to be performed on a popover element being controlled by a control element. */
+  popovertargetaction?: "show" | "hide" | "toggle";
+
+} ;
+
+type BaseEvents = {
+
+
+};
+
+
+
+export type OrChartProps = {
+  /**  */
+  "assets"?: OrChart['assets'];
+  /**  */
+  "activeAsset"?: OrChart['activeAsset'];
+  /**  */
+  "assetAttributes"?: OrChart['assetAttributes'];
+  /** The list of HEX colors representing the line color for each AttributeRef.
+Acts as an override, and will fall back to the colors attribute if not specified.
+The AttributeRef object with Asset ID and Attribute name need to be present in the Chart to work.
+The HEX color should be put in without '#' prefix. For example, you'd use '4d9d2a' instead of '#4d9d2a'. */
+  "attributeColors"?: OrChart['attributeColors'];
+  /** Chart attribute configuration object, specifying characteristics for each Chart line.
+For example, what AttributeRef is aligned to the right side, or what AttributeRef is using a fill.
+Check for ChartAttributeConfig for specification. This HTML attribute expects JSON string input. */
+  "attributeConfig"?: OrChart['attributeConfig'];
+  /**  */
+  "dataProvider"?: OrChart['dataProvider'];
+  /**  */
+  "colors"?: OrChart['colors'];
+  /**  */
+  "datapointQuery"?: OrChart['datapointQuery'];
+  /**  */
+  "config"?: OrChart['config'];
+  /**  */
+  "chartOptions"?: OrChart['chartOptions'];
+  /**  */
+  "realm"?: OrChart['realm'];
+  /**  */
+  "panelName"?: OrChart['panelName'];
+  /**  */
+  "attributeControls"?: OrChart['attributeControls'];
+  /**  */
+  "timeframe"?: OrChart['timeframe'];
+  /**  */
+  "timestampControls"?: OrChart['timestampControls'];
+  /** List of 'time prefix' options like 'this' or 'last', for the user to select from.
+In combination with the timeWindowOptions attribute, it becomes a string like 'last 6 hours'. */
+  "timePrefixOptions"?: OrChart['timePrefixOptions'];
+  /** Selected 'time prefix' of the available timePrefixOptions.
+This string attribute will only accept keys of the timeWindowOptions Array. */
+  "timePrefixKey"?: OrChart['timePrefixKey'];
+  /** List of timeframe options like '6 hours' for the user to select from.
+In combination with the timePrefixKey attribute, it becomes a string like 'last 6 hours'.
+Expects a JSON string input, that is formatted as an JavaScript Map object.
+The map is identified with a unique key, and a combination of `[duration, length]`.
+For example `['6hours', ['hours', 6]]`. */
+  "timeWindowOptions"?: OrChart['timeWindowOptions'];
+  /** Selected 'time window' of the available timeWindowOptions.
+This string attribute will only accept keys of the timeWindowOptions Map. */
+  "timeWindowKey"?: OrChart['timeWindowKey'];
+  /** Boolean attribute to enable/disable stacking the data vertically. (compound line chart)
+On the same axis, it will display a cumulative effect of all data series on top of each other. */
+  "stacked"?: OrChart['stacked'];
+  /**  */
+  "showLegend"?: OrChart['showLegend'];
+  /**  */
+  "denseLegend"?: OrChart['denseLegend'];
+  /**  */
+  "showZoomBar"?: OrChart['showZoomBar'];
+  /**  */
+  "_tableTemplate"?: OrChart['_tableTemplate'];
+
+  /**  */
+  "onrendered"?: (e: CustomEvent<OrChartEvent>) => void;
+}
+
+  export type CustomElements = {
+
+
+  /**
+     * 
+ * 
+ * ## Attributes & Properties
+ * 
+ * Component attributes and properties that can be applied to the element or by using JavaScript.
+ * 
+ * - `assets`: undefined 
+ * - `activeAsset`: undefined 
+ * - `assetAttributes`: undefined 
+ * - `attributeColors`: The list of HEX colors representing the line color for each AttributeRef.
+ * Acts as an override, and will fall back to the colors attribute if not specified.
+ * The AttributeRef object with Asset ID and Attribute name need to be present in the Chart to work.
+ * The HEX color should be put in without '#' prefix. For example, you'd use '4d9d2a' instead of '#4d9d2a'. 
+ * - `attributeConfig`: Chart attribute configuration object, specifying characteristics for each Chart line.
+ * For example, what AttributeRef is aligned to the right side, or what AttributeRef is using a fill.
+ * Check for ChartAttributeConfig for specification. This HTML attribute expects JSON string input. 
+ * - `dataProvider`: undefined 
+ * - `colors`: undefined 
+ * - `datapointQuery`: undefined 
+ * - `config`: undefined 
+ * - `chartOptions`: undefined 
+ * - `realm`: undefined 
+ * - `panelName`: undefined 
+ * - `attributeControls`: undefined 
+ * - `timeframe`: undefined 
+ * - `timestampControls`: undefined 
+ * - `timePrefixOptions`: List of 'time prefix' options like 'this' or 'last', for the user to select from.
+ * In combination with the timeWindowOptions attribute, it becomes a string like 'last 6 hours'. 
+ * - `timePrefixKey`: Selected 'time prefix' of the available timePrefixOptions.
+ * This string attribute will only accept keys of the timeWindowOptions Array. 
+ * - `timeWindowOptions`: List of timeframe options like '6 hours' for the user to select from.
+ * In combination with the timePrefixKey attribute, it becomes a string like 'last 6 hours'.
+ * Expects a JSON string input, that is formatted as an JavaScript Map object.
+ * The map is identified with a unique key, and a combination of `[duration, length]`.
+ * For example `['6hours', ['hours', 6]]`. 
+ * - `timeWindowKey`: Selected 'time window' of the available timeWindowOptions.
+ * This string attribute will only accept keys of the timeWindowOptions Map. 
+ * - `stacked`: Boolean attribute to enable/disable stacking the data vertically. (compound line chart)
+ * On the same axis, it will display a cumulative effect of all data series on top of each other. 
+ * - `showLegend`: undefined 
+ * - `denseLegend`: undefined 
+ * - `showZoomBar`: undefined 
+ * - `_tableTemplate`: undefined 
+ * 
+ * ## Events
+ * 
+ * Events that will be emitted by the component.
+ * 
+ * - `rendered`: undefined
+ * 
+ * ## Methods
+ * 
+ * Methods that can be called to access component functionality.
+ * 
+ * - `applyChartResponsiveness() => void`: undefined
+ * - `_addDatasetHighlight(attrRef: AttributeRef, chart = this._chart) => void`: Adds a Chart line color highlight, by reducing/increasing opacity.
+ * So the given line (represented by assetId and attrName will be emphasized, while others are less visible.
+ * - `loadSettings(reset: boolean) => void`: undefined
+ * - `saveSettings() => void`: undefined
+  */
+    "or-chart": Partial<OrChartProps & BaseProps<OrChart> & BaseEvents>;
+  }
+
+export type CustomCssProperties = {
+
+}
+
+
+declare module 'react' {
+  namespace JSX {
+    interface IntrinsicElements extends CustomElements {}
+  }
+  export interface CSSProperties extends CustomCssProperties {}
+}
+
+declare module 'preact' {
+  namespace JSX {
+    interface IntrinsicElements extends CustomElements {}
+  }
+  export interface CSSProperties extends CustomCssProperties {}
+}
+
+declare module '@builder.io/qwik' {
+  namespace JSX {
+    interface IntrinsicElements extends CustomElements {}
+  }
+  export interface CSSProperties extends CustomCssProperties {}
+}
+
+declare module '@stencil/core' {
+  namespace JSX {
+    interface IntrinsicElements extends CustomElements {}
+  }
+  export interface CSSProperties extends CustomCssProperties {}
+}
+
+declare module 'hono/jsx' {
+  namespace JSX {
+    interface IntrinsicElements extends CustomElements {}
+  }
+  export interface CSSProperties extends CustomCssProperties {}
+}
+
+declare module 'react-native' {
+  namespace JSX {
+    interface IntrinsicElements extends CustomElements {}
+  }
+  export interface CSSProperties extends CustomCssProperties {}
+}
+
+declare global {
+  namespace JSX {
+    interface IntrinsicElements extends CustomElements {}
+  }
+  export interface CSSProperties extends CustomCssProperties {}
+}

package/custom-elements.json

@@ -416,6 +416,9 @@
                 "type": {
                   "text": "void"
                 }
+              },
+              "type": {
+                "text": "applyChartResponsiveness() => void"
               }
             },
             {
@@ -460,7 +463,10 @@
                   "description": "ECharts instance to add the highlight to."
                 }
               ],
-              "description": "Adds a Chart line color highlight, by reducing/increasing opacity.\nSo the given line (represented by assetId and attrName will be emphasized, while others are less visible."
+              "description": "Adds a Chart line color highlight, by reducing/increasing opacity.\nSo the given line (represented by assetId and attrName will be emphasized, while others are less visible.",
+              "type": {
+                "text": "_addDatasetHighlight(attrRef: AttributeRef, chart = this._chart) => void"
+              }
             },
             {
               "kind": "method",
@@ -472,11 +478,17 @@
                     "text": "boolean"
                   }
                 }
-              ]
+              ],
+              "type": {
+                "text": "loadSettings(reset: boolean) => void"
+              }
             },
             {
               "kind": "method",
-              "name": "saveSettings"
+              "name": "saveSettings",
+              "type": {
+                "text": "saveSettings() => void"
+              }
             },
             {
               "kind": "method",
@@ -1013,7 +1025,9 @@
             "package": "lit"
           },
           "tagName": "or-chart",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/index.ts",
+          "definitionPath": "src/index.ts"
         }
       ],
       "exports": [