cx 24.0.3 → 24.2.0

package/dist/ui.js

@@ -2895,7 +2895,7 @@ var subscribers$1,
 	eventBan = 0;
 function executeKeyboardShortcuts(e) {
 	if (Date.now() < eventBan) return;
-	//Avoid duplicate executions as event.stopPropagation() for React events does not stop native events
+	// Avoid duplicate executions as event.stopPropagation() for React events does not stop native events
 	eventBan = Date.now() + 5;
 	subscribers$1 && subscribers$1.notify(e);
 }

package/dist/widgets.js

@@ -6974,7 +6974,7 @@ var Input$2 = /*#__PURE__*/ (function (_VDOM$Component) {
 				className: CSS.element(baseClass, "left-icon"),
 				onMouseDown: preventDefault,
 				onClick: function onClick(e) {
-					return _this2.onChange(e, "enter");
+					return _this2.onChange(e.target.value, "enter");
 				},
 				children: iconVDOM,
 			});
@@ -7038,10 +7038,10 @@ var Input$2 = /*#__PURE__*/ (function (_VDOM$Component) {
 							onMouseMove: this.onMouseMove.bind(this),
 							onMouseLeave: this.onMouseLeave.bind(this),
 							onInput: function onInput(e) {
-								return _this2.onChange(e, "input");
+								return _this2.onChange(e.target.value, "input");
 							},
 							onChange: function onChange(e) {
-								return _this2.onChange(e, "change");
+								return _this2.onChange(e.target.value, "change");
 							},
 							onKeyDown: this.onKeyDown.bind(this),
 							onFocus: this.onFocus.bind(this),
@@ -7080,7 +7080,7 @@ var Input$2 = /*#__PURE__*/ (function (_VDOM$Component) {
 			});
 			this.props.instance.set("focused", false);
 		}
-		this.onChange(e, "blur");
+		this.onChange(e.target.value, "blur");
 	};
 	_proto2.onClearClick = function onClearClick(e) {
 		this.props.instance.set("value", this.props.instance.widget.emptyValue, {
@@ -7101,6 +7101,7 @@ var Input$2 = /*#__PURE__*/ (function (_VDOM$Component) {
 		autoFocus(this.input, this);
 	};
 	_proto2.componentWillUnmount = function componentWillUnmount() {
+		if (this.input == getActiveElement()) this.onChange(this.input.value, "blur");
 		tooltipParentWillUnmount$1(this.props.instance);
 	};
 	_proto2.onKeyDown = function onKeyDown(e) {
@@ -7108,7 +7109,7 @@ var Input$2 = /*#__PURE__*/ (function (_VDOM$Component) {
 		if (instance.widget.handleKeyDown(e, instance) === false) return;
 		switch (e.keyCode) {
 			case KeyCode.enter:
-				this.onChange(e, "enter");
+				this.onChange(e.target.value, "enter");
 				break;
 			case KeyCode.left:
 			case KeyCode.right:
@@ -7118,12 +7119,12 @@ var Input$2 = /*#__PURE__*/ (function (_VDOM$Component) {
 	};
 	_proto2.UNSAFE_componentWillReceiveProps = function UNSAFE_componentWillReceiveProps(props) {
 		var data = props.data;
-		//the second check is required for debouncing, sometimes the value in the store lags after the input
-		//and update may be caused by some other property, i.e. visited
+		// The second check is required for debouncing, sometimes the value in the store lags after the input
+		// and update may be caused by some other property, i.e. visited
 		if (data.value != this.input.value && data.value != this.props.data.value) this.input.value = data.value || "";
 		tooltipParentWillReceiveProps$1.apply(void 0, [this.input].concat(getFieldTooltip(props.instance)));
 	};
-	_proto2.onChange = function onChange(e, change) {
+	_proto2.onChange = function onChange(textValue, change) {
 		var _this$props3 = this.props,
 			instance = _this$props3.instance,
 			data = _this$props3.data;
@@ -7135,7 +7136,7 @@ var Input$2 = /*#__PURE__*/ (function (_VDOM$Component) {
 		}
 		var widget = instance.widget;
 		if (widget.reactOn.indexOf(change) != -1) {
-			var text = this.trimmed(e.target.value);
+			var text = this.trimmed(textValue);
 			if (data.maxLength != null && text.length > data.maxLength) {
 				text = text.substring(0, data.maxLength);
 				this.input.value = text;
@@ -10000,6 +10001,16 @@ var Input$1 = /*#__PURE__*/ (function (_VDOM$Component) {
 		autoFocus(this.input, this);
 	};
 	_proto2.componentWillUnmount = function componentWillUnmount() {
+		if (this.input == getActiveElement()) {
+			this.onChange(
+				{
+					target: {
+						value: this.input.value,
+					},
+				},
+				"blur",
+			);
+		}
 		tooltipParentWillUnmount$1(this.props.instance);
 	};
 	_proto2.getPreCursorDigits = function getPreCursorDigits(text, cursor, decimalSeparator) {
@@ -10143,12 +10154,12 @@ var Input$1 = /*#__PURE__*/ (function (_VDOM$Component) {
 			var fmt = data.format;
 			var decimalSeparator = this.getDecimalSeparator(fmt) || Format.value(1.1, "n;1")[1];
 			var formatted = Format.value(value, fmt);
-			//re-parse to avoid differences between formatted value and value in the store
+			// Re-parse to avoid differences between formatted value and value in the store
 
 			value = widget.parseValue(formatted, instance) * data.scale + data.offset;
 
-			//allow users to type numbers like 100.0003 or -0.05 without interruptions
-			//if the last typed in character is zero or dot (decimal separator) skip processing it
+			// Allow users to type numbers like 100.0003 or -0.05 without interruptions
+			// If the last typed character is zero or dot (decimal separator), skip processing it
 			if (
 				change == "change" &&
 				this.input.selectionStart == this.input.selectionEnd &&
@@ -10159,7 +10170,7 @@ var Input$1 = /*#__PURE__*/ (function (_VDOM$Component) {
 			)
 				return;
 			if (change != "blur") {
-				//format, but keep the correct cursor position
+				// Format, but keep the correct cursor position
 				var preCursorText = this.getPreCursorDigits(this.input.value, this.input.selectionStart, decimalSeparator);
 				this.input.value = formatted;
 				this.updateCursorPosition(preCursorText);
@@ -10290,13 +10301,13 @@ var Input = /*#__PURE__*/ (function (_VDOM$Component) {
 						data.inputAttrs,
 						{
 							onInput: function onInput(e) {
-								return _this2.onChange(e, "input");
+								return _this2.onChange(e.target.value, "input");
 							},
 							onChange: function onChange(e) {
-								return _this2.onChange(e, "change");
+								return _this2.onChange(e.target.value, "change");
 							},
 							onBlur: function onBlur(e) {
-								_this2.onChange(e, "blur");
+								_this2.onChange(e.target.value, "blur");
 							},
 							onFocus: function onFocus(e) {
 								return _this2.onFocus();
@@ -10320,6 +10331,9 @@ var Input = /*#__PURE__*/ (function (_VDOM$Component) {
 		});
 	};
 	_proto2.componentWillUnmount = function componentWillUnmount() {
+		if (this.input == getActiveElement()) {
+			this.onChange(this.input.value, "blur");
+		}
 		tooltipParentWillUnmount$1(this.props.instance);
 	};
 	_proto2.componentDidMount = function componentDidMount() {
@@ -10349,7 +10363,7 @@ var Input = /*#__PURE__*/ (function (_VDOM$Component) {
 		}
 		tooltipParentWillReceiveProps$1.apply(void 0, [this.input].concat(getFieldTooltip(instance)));
 	};
-	_proto2.onChange = function onChange(e, change) {
+	_proto2.onChange = function onChange(inputValue, change) {
 		var _this$props2 = this.props,
 			instance = _this$props2.instance,
 			data = _this$props2.data;
@@ -10365,11 +10379,11 @@ var Input = /*#__PURE__*/ (function (_VDOM$Component) {
 		}
 		if (data.required) {
 			instance.setState({
-				empty: !e.target.value,
+				empty: !inputValue,
 			});
 		}
 		if (instance.widget.reactOn.indexOf(change) != -1) {
-			var value = e.target.value || widget.emptyValue;
+			var value = inputValue || widget.emptyValue;
 			instance.set("value", value);
 		}
 	};
@@ -12111,10 +12125,10 @@ var MonthInput = /*#__PURE__*/ (function (_VDOM$Component) {
 					tabIndex: data.tabIndex,
 					placeholder: data.placeholder,
 					onInput: function onInput(e) {
-						return _this3.onChange(e, "input");
+						return _this3.onChange(e.target.value, "input");
 					},
 					onChange: function onChange(e) {
-						return _this3.onChange(e, "change");
+						return _this3.onChange(e.target.value, "change");
 					},
 					onKeyDown: function onKeyDown(e) {
 						return _this3.onKeyDown(e);
@@ -12171,7 +12185,7 @@ var MonthInput = /*#__PURE__*/ (function (_VDOM$Component) {
 		switch (e.keyCode) {
 			case KeyCode.enter:
 				e.stopPropagation();
-				this.onChange(e, "enter");
+				this.onChange(e.target.value, "enter");
 				break;
 			case KeyCode.esc:
 				if (this.state.dropdownOpen) {
@@ -12201,7 +12215,7 @@ var MonthInput = /*#__PURE__*/ (function (_VDOM$Component) {
 			this.setState({
 				focus: false,
 			});
-		this.onChange(e, "blur");
+		this.onChange(e.target.value, "blur");
 	};
 	_proto2.closeDropdown = function closeDropdown(e, callback) {
 		var _this5 = this;
@@ -12257,13 +12271,16 @@ var MonthInput = /*#__PURE__*/ (function (_VDOM$Component) {
 		autoFocus(this.input, this);
 	};
 	_proto2.componentWillUnmount = function componentWillUnmount() {
+		if (this.input == getActiveElement()) {
+			this.onChange(this.input.value, "blur");
+		}
 		tooltipParentWillUnmount$1(this.props.instance);
 	};
-	_proto2.onChange = function onChange(e, eventType) {
+	_proto2.onChange = function onChange(inputValue, eventType) {
 		var instance = this.props.instance;
 		var widget = instance.widget;
 		if (widget.reactOn.indexOf(eventType) == -1) return;
-		var parts = e.target.value.split("-");
+		var parts = inputValue.split("-");
 		var date1 = widget.parseDate(parts[0]);
 		var date2 = widget.parseDate(parts[1]) || date1;
 		if ((date1 != null && isNaN(date1)) || (date2 != null && isNaN(date2))) {
@@ -12503,10 +12520,10 @@ var ColorInput = /*#__PURE__*/ (function (_VDOM$Component) {
 						data.inputAttrs,
 						{
 							onInput: function onInput(e) {
-								return _this3.onChange(e, "input");
+								return _this3.onChange(e.target.value, "input");
 							},
 							onChange: function onChange(e) {
-								return _this3.onChange(e, "change");
+								return _this3.onChange(e.target.value, "change");
 							},
 							onKeyDown: function onKeyDown(e) {
 								return _this3.onKeyDown(e);
@@ -12565,7 +12582,7 @@ var ColorInput = /*#__PURE__*/ (function (_VDOM$Component) {
 		switch (e.keyCode) {
 			case KeyCode.enter:
 				e.stopPropagation();
-				this.onChange(e, "enter");
+				this.onChange(e.target.value, "enter");
 				break;
 			case KeyCode.esc:
 				if (this.state.dropdownOpen) {
@@ -12591,7 +12608,7 @@ var ColorInput = /*#__PURE__*/ (function (_VDOM$Component) {
 			this.setState({
 				focus: false,
 			});
-		this.onChange(e, "blur");
+		this.onChange(e.target.value, "blur");
 	};
 	_proto2.closeDropdown = function closeDropdown(e, callback) {
 		var _this5 = this;
@@ -12639,6 +12656,9 @@ var ColorInput = /*#__PURE__*/ (function (_VDOM$Component) {
 		if (this.props.instance.widget.autoFocus && !isTouchDevice()) this.input.focus();
 	};
 	_proto2.componentWillUnmount = function componentWillUnmount() {
+		if (this.input == getActiveElement()) {
+			this.onChange(this.input.value, "blur");
+		}
 		tooltipParentWillUnmount$1(this.props.instance);
 	};
 	_proto2.onClearClick = function onClearClick(e) {
@@ -12650,25 +12670,25 @@ var ColorInput = /*#__PURE__*/ (function (_VDOM$Component) {
 		e.stopPropagation();
 		e.preventDefault();
 	};
-	_proto2.onChange = function onChange(e, eventType) {
+	_proto2.onChange = function onChange(inputValue, eventType) {
 		var _this$props2 = this.props,
 			instance = _this$props2.instance,
 			data = _this$props2.data;
 		var widget = instance.widget;
-		if (eventType == "blur")
+		if (eventType == "blur") {
 			instance.setState({
 				visited: true,
 			});
-		var text = e.target.value;
+		}
 		var isValid;
 		try {
-			parseColor(text);
+			parseColor(inputValue);
 			isValid = true;
 		} catch (e) {
 			isValid = false;
 		}
 		if (eventType == "blur" || eventType == "enter") {
-			var value = text || widget.emptyValue;
+			var value = inputValue || widget.emptyValue;
 			if (isValid && value !== data.value) instance.set("value", value);
 			instance.setState({
 				inputError: !isValid && "Invalid color entered.",
@@ -14631,10 +14651,10 @@ var DateTimeInput = /*#__PURE__*/ (function (_VDOM$Component) {
 						data.inputAttrs,
 						{
 							onInput: function onInput(e) {
-								return _this3.onChange(e, "input");
+								return _this3.onChange(e.target.value, "input");
 							},
 							onChange: function onChange(e) {
-								return _this3.onChange(e, "change");
+								return _this3.onChange(e.target.value, "change");
 							},
 							onKeyDown: function onKeyDown(e) {
 								return _this3.onKeyDown(e);
@@ -14696,7 +14716,7 @@ var DateTimeInput = /*#__PURE__*/ (function (_VDOM$Component) {
 		if (instance.widget.handleKeyDown(e, instance) === false) return;
 		switch (e.keyCode) {
 			case KeyCode.enter:
-				this.onChange(e, "enter");
+				this.onChange(e.target.value, "enter");
 				break;
 			case KeyCode.esc:
 				if (this.state.dropdownOpen) {
@@ -14727,7 +14747,7 @@ var DateTimeInput = /*#__PURE__*/ (function (_VDOM$Component) {
 			this.setState({
 				focus: false,
 			});
-		this.onChange(e, "blur");
+		this.onChange(e.target.value, "blur");
 	};
 	_proto2.closeDropdown = function closeDropdown(e, callback) {
 		var _this5 = this;
@@ -14783,9 +14803,12 @@ var DateTimeInput = /*#__PURE__*/ (function (_VDOM$Component) {
 		autoFocus(this.input, this);
 	};
 	_proto2.componentWillUnmount = function componentWillUnmount() {
+		if (this.input == getActiveElement()) {
+			this.onChange(this.input.value, "blur");
+		}
 		tooltipParentWillUnmount$1(this.props.instance);
 	};
-	_proto2.onChange = function onChange(e, eventType) {
+	_proto2.onChange = function onChange(inputValue, eventType) {
 		var _this$props2 = this.props,
 			instance = _this$props2.instance,
 			data = _this$props2.data;
@@ -14796,7 +14819,7 @@ var DateTimeInput = /*#__PURE__*/ (function (_VDOM$Component) {
 			instance.setState({
 				visited: true,
 			});
-		this.setValue(e.target.value, data.value);
+		this.setValue(inputValue, data.value);
 	};
 	_proto2.setValue = function setValue(text, baseValue) {
 		var _this$props3 = this.props,
@@ -19218,6 +19241,7 @@ export {
 	HighlightedSearchText,
 	HtmlElement,
 	Icon,
+	Label,
 	LabeledContainer,
 	Link,
 	LinkButton,

package/package.json

@@ -1,6 +1,6 @@
 {
    "name": "cx",
-   "version": "24.0.3",
+   "version": "24.2.0",
    "description": "Advanced JavaScript UI framework for admin and dashboard applications with ready to use grid, form and chart components.",
    "main": "index.js",
    "jsnext:main": "src/index.js",

package/src/charts/ColorMap.js

@@ -1,5 +1,5 @@
-import {Widget} from '../ui/Widget';
-import {PureContainer} from '../ui/PureContainer';
+import { Widget } from '../ui/Widget';
+import { PureContainer } from '../ui/PureContainer';
 
 export class ColorMap extends Widget {
    declareData() {
@@ -21,7 +21,7 @@ export class ColorMap extends Widget {
             let cache = this.onGetCache ? instance.invoke("onGetCache") : {};
             map = cache[colorMap];
             if (!map) {
-               let {data} = instance;
+               let { data } = instance;
                map = context.colorMaps[colorMap] = cache[colorMap] = new ColorIndex({
                   offset: data.offset,
                   step: data.step,
@@ -67,7 +67,7 @@ ColorMap.Scope = ColorMapScope;
 Widget.alias('color-map', ColorMap);
 
 export class ColorIndex {
-   constructor({offset, step, size}) {
+   constructor({ offset, step, size }) {
       this.colorMap = {};
       this.dirty = true;
       this.offset = offset;
@@ -83,7 +83,6 @@ export class ColorIndex {
    }
 
    map(name) {
-
       if (this.dirty) {
          this.dirty = false;
          if (!this.step) {
@@ -94,6 +93,5 @@ export class ColorIndex {
 
       let index = this.colorMap[name] || 0;
       return Math.round(this.offset + this.step * index + this.size) % this.size;
-
    }
 }

package/src/charts/axis/Axis.d.ts

@@ -1,96 +1,96 @@
-import { Instance } from "./../../ui/Instance.d";
-import * as Cx from "../../core";
-import { BoundedObject, BoundedObjectProps } from "../../svg/BoundedObject";
-
-export interface AxisProps extends BoundedObjectProps {
-   /** Set to `true` for vertical axes. */
-   vertical?: boolean;
-
-   /** Used as a secondary axis. Displayed at the top/right. */
-   secondary?: boolean;
-
-   /** When set to `true`, the values are displayed in descending order. */
-   inverted?: Cx.BooleanProp;
-
-   /** When set to `true`, rendering of visual elements of the axis, such as ticks and labels, is skipped, but their function is preserved. */
-   hidden?: boolean;
-
-   tickSize?: number;
-   minTickDistance?: number;
-   minLabelDistanceVertical?: number;
-   minLabelDistanceHorizontal?: number;
-
-   /** Distance between labels and the axis. */
-   labelOffset?: number | string;
-
-   /** Label rotation angle in degrees. */
-   labelRotation?: Cx.Prop<number | string>;
-
-   /** Label text-anchor value. Allowed values are start, end and middle. Default value is set based on the value of vertical and secondary flags. */
-   labelAnchor?: "start" | "end" | "middle" | "auto";
-
-   /** Horizontal text offset. */
-   labelDx?: number | string;
-
-   /** Vertical text offset which can be used for vertical alignment. */
-   labelDy?: number | string;
-
-   /** Set to `true` to break long labels into multiple lines. Default value is `false`. Text is split at space characters. See also `labelMaxLineLength` and `labelLineCountDyFactor`. */
-   labelWrap?: boolean;
-
-   /**
-    * Used for vertical adjustment of multi-line labels. Default value is `auto` which means
-    * that value is initialized based on axis configuration. Value `0` means that label will grow towards
-    * the bottom of the screen. Value `-1` will make labels to grow towards the top of the screen.
-    * `-0.5` will make labels vertically centered.
-    */
-   labelLineCountDyFactor?: number | string;
-
-   /**
-    * Used for vertical adjustment of multi-line labels. Default value is 1 which means
-    * that labels are stacked without any space between them. Value of 1.4 will add 40% of the label height as a space between labels.
-    */
-   labelLineHeight?: number | string;
-
-   /** If `labelWrap` is on, this number is used as a measure to split labels into multiple lines. Default value is `10`. */
-   labelMaxLineLength?: number;
-
-   /** Set to true to hide the axis labels. */
-   hideLabels?: boolean;
-
-   /** Set to true to hide the axis line. */
-   hideLine?: boolean;
-
-   /** Set to true to hide the axis ticks. */
-   hideTicks?: boolean;
-
-   /** Additional CSS style to be applied to the axis line. */
-   lineStyle?: Cx.StyleProp;
-
-   /** Additional CSS style to be applied to the axis ticks. */
-   tickStyle?: Cx.StyleProp;
-
-   /** Additional CSS style to be applied to the axis labels. */
-   labelStyle?: Cx.StyleProp;
-
-   /** Additional CSS class to be applied to the axis line. */
-   lineClass?: Cx.ClassProp;
-
-   /** Additional CSS class to be applied to the axis ticks. */
-   tickClass?: Cx.ClassProp;
-
-   /** Additional CSS class to be applied to the axis labels. */
-   labelClass?: Cx.ClassProp;
-
-   onMeasured?: (info: any, instance: Instance) => void;
-
-   /** A function used to create a formatter function for axis labels. See Complex Labels example in the CxJS documentation for more info. */
-   onCreateLabelFormatter?:
-      | string
-      | ((
-           context: any,
-           instance: Instance
-        ) => (formattedValue: string, value: any) => { text: string; style?: any; className?: string }[]);
-}
-
-export class Axis extends BoundedObject {}
+import { Instance } from "./../../ui/Instance.d";
+import * as Cx from "../../core";
+import { BoundedObject, BoundedObjectProps } from "../../svg/BoundedObject";
+
+export interface AxisProps extends BoundedObjectProps {
+   /** Set to `true` for vertical axes. */
+   vertical?: boolean;
+
+   /** Used as a secondary axis. Displayed at the top/right. */
+   secondary?: boolean;
+
+   /** When set to `true`, the values are displayed in descending order. */
+   inverted?: Cx.BooleanProp;
+
+   /** When set to `true`, rendering of visual elements of the axis, such as ticks and labels, is skipped, but their function is preserved. */
+   hidden?: boolean;
+
+   tickSize?: number;
+   minTickDistance?: number;
+   minLabelDistanceVertical?: number;
+   minLabelDistanceHorizontal?: number;
+
+   /** Distance between labels and the axis. */
+   labelOffset?: number | string;
+
+   /** Label rotation angle in degrees. */
+   labelRotation?: Cx.Prop<number | string>;
+
+   /** Label text-anchor value. Allowed values are start, end and middle. Default value is set based on the value of vertical and secondary flags. */
+   labelAnchor?: "start" | "end" | "middle" | "auto";
+
+   /** Horizontal text offset. */
+   labelDx?: number | string;
+
+   /** Vertical text offset which can be used for vertical alignment. */
+   labelDy?: number | string;
+
+   /** Set to `true` to break long labels into multiple lines. Default value is `false`. Text is split at space characters. See also `labelMaxLineLength` and `labelLineCountDyFactor`. */
+   labelWrap?: boolean;
+
+   /**
+    * Used for vertical adjustment of multi-line labels. Default value is `auto` which means
+    * that value is initialized based on axis configuration. Value `0` means that label will grow towards
+    * the bottom of the screen. Value `-1` will make labels to grow towards the top of the screen.
+    * `-0.5` will make labels vertically centered.
+    */
+   labelLineCountDyFactor?: number | string;
+
+   /**
+    * Used for vertical adjustment of multi-line labels. Default value is 1 which means
+    * that labels are stacked without any space between them. Value of 1.4 will add 40% of the label height as a space between labels.
+    */
+   labelLineHeight?: number | string;
+
+   /** If `labelWrap` is on, this number is used as a measure to split labels into multiple lines. Default value is `10`. */
+   labelMaxLineLength?: number;
+
+   /** Set to true to hide the axis labels. */
+   hideLabels?: boolean;
+
+   /** Set to true to hide the axis line. */
+   hideLine?: boolean;
+
+   /** Set to true to hide the axis ticks. */
+   hideTicks?: boolean;
+
+   /** Additional CSS style to be applied to the axis line. */
+   lineStyle?: Cx.StyleProp;
+
+   /** Additional CSS style to be applied to the axis ticks. */
+   tickStyle?: Cx.StyleProp;
+
+   /** Additional CSS style to be applied to the axis labels. */
+   labelStyle?: Cx.StyleProp;
+
+   /** Additional CSS class to be applied to the axis line. */
+   lineClass?: Cx.ClassProp;
+
+   /** Additional CSS class to be applied to the axis ticks. */
+   tickClass?: Cx.ClassProp;
+
+   /** Additional CSS class to be applied to the axis labels. */
+   labelClass?: Cx.ClassProp;
+
+   onMeasured?: (info: any, instance: Instance) => void;
+
+   /** A function used to create a formatter function for axis labels. See Complex Labels example in the CxJS documentation for more info. */
+   onCreateLabelFormatter?:
+      | string
+      | ((
+           context: any,
+           instance: Instance
+        ) => (formattedValue: string, value: any) => { text: string; style?: any; className?: string }[]);
+}
+
+export class Axis extends BoundedObject {}