cx 26.0.6 → 26.0.8

package/package.json

@@ -1,6 +1,6 @@
 {
    "name": "cx",
-   "version": "26.0.6",
+   "version": "26.0.8",
    "description": "Advanced JavaScript UI framework for admin and dashboard applications with ready to use grid, form and chart components.",
    "exports": {
       "./data/": "./build/data/",
@@ -19,6 +19,8 @@
       "./charts": "./build/charts/index.js",
       "./jsx-runtime": "./build/jsx-runtime.js",
       "./jsx-runtime.js": "./build/jsx-runtime.js",
+      "./jsx-dev-runtime": "./build/jsx-runtime.js",
+      "./jsx-dev-runtime.js": "./build/jsx-runtime.js",
       "./src/": "./src/",
       "./sass/": "./src/",
       "./build/": "./build/",

package/src/charts/LineGraph.tsx

@@ -7,6 +7,7 @@ import { Instance } from "../ui/Instance";
 import { RenderingContext } from "../ui/RenderingContext";
 import { NumberProp, BooleanProp, StringProp, RecordsProp, StyleProp } from "../ui/Prop";
 import type { ChartRenderingContext } from "./Chart";
+import { ClassProp } from "../ui/Prop";
 
 interface LinePoint {
    x: number;
@@ -88,6 +89,18 @@ export interface LineGraphConfig extends WidgetConfig {
 
    /** Shape to use in legend. */
    legendShape?: string;
+
+   /**
+    * Additional CSS classes to be applied to the field.
+    * If an object is provided, all keys with a "truthy" value will be added to the CSS class list.
+    */
+   class?: ClassProp;
+
+   /**
+    * Additional CSS classes to be applied to the field.
+    * If an object is provided, all keys with a "truthy" value will be added to the CSS class list.
+    */
+   className?: ClassProp;
 }
 
 export interface LineGraphInstance extends Instance {
@@ -437,5 +450,6 @@ LineGraph.prototype.hiddenBase = false;
 
 LineGraph.prototype.smooth = false;
 LineGraph.prototype.smoothingRatio = 0.05;
+LineGraph.prototype.styled = true;
 
 Widget.alias("line-graph", LineGraph);

package/src/jsx-runtime.ts

@@ -1,10 +1,11 @@
 import type { JSX as ReactJSX } from "react";
 import { Instance } from "./ui/Instance";
-import type { Prop } from "./ui/Prop";
+import type { ClassProp, Prop } from "./ui/Prop";
 import { Widget } from "./ui/Widget";
 import { isArray } from "./util/isArray";
 import { isString } from "./util/isString";
 import { HtmlElement, HtmlElementConfig } from "./widgets/HtmlElement";
+import { ChildNode } from "./ui/Container";
 
 export function jsx(typeName: any, props: any, key?: string): any {
    if (isArray(typeName)) return typeName;
@@ -45,10 +46,12 @@ type CxEventHandler<T> = T extends (event: infer E) => any
 
 type CxIntrinsicElement<T> = {
    [K in keyof T]: K extends "children"
-      ? any
-      : IsEventHandler<K, T[K]> extends true
-        ? CxEventHandler<T[K]>
-        : Prop<T[K]>;
+      ? ChildNode | ChildNode[]
+      : K extends "className" | "class"
+        ? ClassProp
+        : IsEventHandler<K, T[K]> extends true
+          ? CxEventHandler<T[K]>
+          : Prop<T[K]>;
 } & HtmlElementConfig;
 
 type CxIntrinsicElements = {

package/src/util/addEventListenerWithOptions.ts

@@ -1,41 +1,41 @@
-import { browserSupportsPassiveEventHandlers } from "./browserSupportsPassiveEventHandlers";
-
-interface EventMap {
-   wheel: WheelEvent;
-   scroll: Event;
-   click: MouseEvent;
-   mousedown: MouseEvent;
-   mouseup: MouseEvent;
-   mousemove: MouseEvent;
-   touchstart: TouchEvent;
-   touchmove: TouchEvent;
-   touchend: TouchEvent;
-   keydown: KeyboardEvent;
-   keyup: KeyboardEvent;
-   keypress: KeyboardEvent;
-}
-
-export function addEventListenerWithOptions<K extends keyof EventMap>(
-   element: Element,
-   event: K,
-   callback: (event: EventMap[K]) => void,
-   options: AddEventListenerOptions
-): () => void;
-export function addEventListenerWithOptions(
-   element: Element,
-   event: string,
-   callback: (event: Event) => void,
-   options: AddEventListenerOptions
-): () => void;
-export function addEventListenerWithOptions(
-   element: Element,
-   event: string,
-   callback: (event: Event) => void,
-   options: AddEventListenerOptions
-): () => void {
-   let thirdParam = browserSupportsPassiveEventHandlers() ? options : options.capture === true;
-   element.addEventListener(event, callback as any, thirdParam);
-   return () => {
-      element.removeEventListener(event, callback as any, thirdParam);
-   };
-}
+import { browserSupportsPassiveEventHandlers } from "./browserSupportsPassiveEventHandlers";
+
+interface EventMap {
+   wheel: WheelEvent;
+   scroll: Event;
+   click: MouseEvent;
+   mousedown: MouseEvent;
+   mouseup: MouseEvent;
+   mousemove: MouseEvent;
+   touchstart: TouchEvent;
+   touchmove: TouchEvent;
+   touchend: TouchEvent;
+   keydown: KeyboardEvent;
+   keyup: KeyboardEvent;
+   keypress: KeyboardEvent;
+}
+
+export function addEventListenerWithOptions<K extends keyof EventMap>(
+   element: Element | Document,
+   event: K,
+   callback: (event: EventMap[K]) => void,
+   options: AddEventListenerOptions,
+): () => void;
+export function addEventListenerWithOptions(
+   element: Element | Document,
+   event: string,
+   callback: (event: Event) => void,
+   options: AddEventListenerOptions,
+): () => void;
+export function addEventListenerWithOptions(
+   element: Element | Document,
+   event: string,
+   callback: (event: Event) => void,
+   options: AddEventListenerOptions,
+): () => void {
+   let thirdParam = browserSupportsPassiveEventHandlers() ? options : options.capture === true;
+   element.addEventListener(event, callback as any, thirdParam);
+   return () => {
+      element.removeEventListener(event, callback as any, thirdParam);
+   };
+}

package/src/widgets/nav/MenuItem.tsx

@@ -61,6 +61,7 @@ export interface MenuItemConfig extends HtmlElementConfig {
    padding?: string;
    hideCursor?: boolean;
    dropdown?: any;
+   onClick?: string | ((e: React.MouseEvent | null, instance: HtmlElementInstance<MenuItem>) => void);
 }
 
 export class MenuItemInstance extends HtmlElementInstance<MenuItem> {