cx 26.3.10 → 26.4.0

package/src/ui/exprHelpers.ts

@@ -1,96 +1,96 @@
-import { computable } from "../data/computable";
-import { AccessorChain } from "../data/createAccessorModelProxy";
-import { Selector } from "../data/Selector";
-import { Format } from "../util/Format";
-import { expr } from "./expr";
-
-/** Returns a selector that converts the value to boolean using !! */
-export function truthy<V>(arg: AccessorChain<V>): Selector<boolean> {
-   return expr(arg, (x) => !!x);
-}
-
-/** Returns a selector that checks if the value is falsy using ! */
-export function falsy<V>(arg: AccessorChain<V>): Selector<boolean> {
-   return expr(arg, (x) => !x);
-}
-
-/** Returns a selector that checks if the value is strictly true (=== true) */
-export function isTrue(arg: AccessorChain<any>): Selector<boolean> {
-   return expr(arg, (x) => x === true);
-}
-
-/** Returns a selector that checks if the value is strictly false (=== false) */
-export function isFalse(arg: AccessorChain<any>): Selector<boolean> {
-   return expr(arg, (x) => x === false);
-}
-
-/** Returns a selector that checks if the value is not null or undefined (x != null) */
-export function hasValue<V>(arg: AccessorChain<V>): Selector<boolean> {
-   return expr(arg, (x) => x != null);
-}
-
-/** Returns a selector that checks if a string or array is empty (null, undefined, or length === 0) */
-export function isEmpty(arg: AccessorChain<string | any[] | null | undefined>): Selector<boolean> {
-   return expr(arg, (x) => x == null || x.length === 0);
-}
-
-/** Returns a selector that checks if a string or array is non-empty (not null/undefined and length > 0) */
-export function isNonEmpty(arg: AccessorChain<string | any[] | null | undefined>): Selector<boolean> {
-   return expr(arg, (x) => x != null && x.length > 0);
-}
-
-/** Returns a selector that checks if the value is less than the given value */
-export function lessThan<V>(arg: AccessorChain<V>, value: V): Selector<boolean> {
-   return expr(arg, (x) => x < value);
-}
-
-/** Returns a selector that checks if the value is less than or equal to the given value */
-export function lessThanOrEqual<V>(arg: AccessorChain<V>, value: V): Selector<boolean> {
-   return expr(arg, (x) => x <= value);
-}
-
-/** Returns a selector that checks if the value is greater than the given value */
-export function greaterThan<V>(arg: AccessorChain<V>, value: V): Selector<boolean> {
-   return expr(arg, (x) => x > value);
-}
-
-/** Returns a selector that checks if the value is greater than or equal to the given value */
-export function greaterThanOrEqual<V>(arg: AccessorChain<V>, value: V): Selector<boolean> {
-   return expr(arg, (x) => x >= value);
-}
-
-/** Returns a selector that checks if the value equals the given value using == */
-export function equal<V>(arg: AccessorChain<V>, value: V): Selector<boolean> {
-   return expr(arg, (x) => x == value);
-}
-
-/** Returns a selector that checks if the value does not equal the given value using != */
-export function notEqual<V>(arg: AccessorChain<V>, value: V): Selector<boolean> {
-   return expr(arg, (x) => x != value);
-}
-
-/** Returns a selector that checks if the value strictly equals the given value using === */
-export function strictEqual<V>(arg: AccessorChain<V>, value: V): Selector<boolean> {
-   return expr(arg, (x) => x === value);
-}
-
-/** Returns a selector that checks if the value strictly does not equal the given value using !== */
-export function strictNotEqual<V>(arg: AccessorChain<V>, value: V): Selector<boolean> {
-   return expr(arg, (x) => x !== value);
-}
-
-/** Returns a selector that formats the value using the specified format string.
- * Format strings use semicolon-separated syntax: "formatType;param1;param2"
- * @param arg - The accessor chain to the value
- * @param fmt - The format string
- * @param nullText - Optional text to display for null/undefined values
- * @example
- * format(m.price, "n;2") // formats as number with 2 decimal places
- * format(m.date, "d") // formats as date
- * format(m.value, "p;0;2") // formats as percentage with 0-2 decimal places
- * format(m.value, "n;2", "N/A") // shows "N/A" for null values
- */
-export function format<V>(arg: AccessorChain<V>, fmt: string, nullText?: string): Selector<string> {
-   let f = nullText != null ? `${fmt}|${nullText}` : fmt;
-   return computable(arg, (x) => Format.value(x, f));
-}
+import { computable } from "../data/computable";
+import { AccessorChain } from "../data/createAccessorModelProxy";
+import { Selector } from "../data/Selector";
+import { Format } from "../util/Format";
+import { expr } from "./expr";
+
+/** Returns a selector that converts the value to boolean using !! */
+export function truthy<V>(arg: AccessorChain<V>): Selector<boolean> {
+   return expr(arg, (x) => !!x);
+}
+
+/** Returns a selector that checks if the value is falsy using ! */
+export function falsy<V>(arg: AccessorChain<V>): Selector<boolean> {
+   return expr(arg, (x) => !x);
+}
+
+/** Returns a selector that checks if the value is strictly true (=== true) */
+export function isTrue(arg: AccessorChain<any>): Selector<boolean> {
+   return expr(arg, (x) => x === true);
+}
+
+/** Returns a selector that checks if the value is strictly false (=== false) */
+export function isFalse(arg: AccessorChain<any>): Selector<boolean> {
+   return expr(arg, (x) => x === false);
+}
+
+/** Returns a selector that checks if the value is not null or undefined (x != null) */
+export function hasValue<V>(arg: AccessorChain<V>): Selector<boolean> {
+   return expr(arg, (x) => x != null);
+}
+
+/** Returns a selector that checks if a string or array is empty (null, undefined, or length === 0) */
+export function isEmpty(arg: AccessorChain<string | any[] | null | undefined>): Selector<boolean> {
+   return expr(arg, (x) => x == null || x.length === 0);
+}
+
+/** Returns a selector that checks if a string or array is non-empty (not null/undefined and length > 0) */
+export function isNonEmpty(arg: AccessorChain<string | any[] | null | undefined>): Selector<boolean> {
+   return expr(arg, (x) => x != null && x.length > 0);
+}
+
+/** Returns a selector that checks if the value is less than the given value */
+export function lessThan<V>(arg: AccessorChain<V>, value: V): Selector<boolean> {
+   return expr(arg, (x) => x < value);
+}
+
+/** Returns a selector that checks if the value is less than or equal to the given value */
+export function lessThanOrEqual<V>(arg: AccessorChain<V>, value: V): Selector<boolean> {
+   return expr(arg, (x) => x <= value);
+}
+
+/** Returns a selector that checks if the value is greater than the given value */
+export function greaterThan<V>(arg: AccessorChain<V>, value: V): Selector<boolean> {
+   return expr(arg, (x) => x > value);
+}
+
+/** Returns a selector that checks if the value is greater than or equal to the given value */
+export function greaterThanOrEqual<V>(arg: AccessorChain<V>, value: V): Selector<boolean> {
+   return expr(arg, (x) => x >= value);
+}
+
+/** Returns a selector that checks if the value equals the given value using == */
+export function equal<V>(arg: AccessorChain<V>, value: V): Selector<boolean> {
+   return expr(arg, (x) => x == value);
+}
+
+/** Returns a selector that checks if the value does not equal the given value using != */
+export function notEqual<V>(arg: AccessorChain<V>, value: V): Selector<boolean> {
+   return expr(arg, (x) => x != value);
+}
+
+/** Returns a selector that checks if the value strictly equals the given value using === */
+export function strictEqual<V>(arg: AccessorChain<V>, value: V): Selector<boolean> {
+   return expr(arg, (x) => x === value);
+}
+
+/** Returns a selector that checks if the value strictly does not equal the given value using !== */
+export function strictNotEqual<V>(arg: AccessorChain<V>, value: V): Selector<boolean> {
+   return expr(arg, (x) => x !== value);
+}
+
+/** Returns a selector that formats the value using the specified format string.
+ * Format strings use semicolon-separated syntax: "formatType;param1;param2"
+ * @param arg - The accessor chain to the value
+ * @param fmt - The format string
+ * @param nullText - Optional text to display for null/undefined values
+ * @example
+ * format(m.price, "n;2") // formats as number with 2 decimal places
+ * format(m.date, "d") // formats as date
+ * format(m.value, "p;0;2") // formats as percentage with 0-2 decimal places
+ * format(m.value, "n;2", "N/A") // shows "N/A" for null values
+ */
+export function format<V>(arg: AccessorChain<V>, fmt: string, nullText?: string): Selector<string> {
+   let f = nullText != null ? `${fmt}|${nullText}` : fmt;
+   return computable(arg, (x) => Format.value(x, f));
+}

package/src/ui/flattenProps.ts

@@ -1,21 +1,21 @@
-export const flattenProps = (props: any): any => {
-
-   if (!props) return {};
-
-   if (props.jsxSpread) {
-      props = {
-         ...props,
-         ...props.jsxSpread.reduce((acc: any, prop: any) => Object.assign(acc, prop), {})
-      };
-   }
-
-   if (props.$props !== undefined) {
-      props = {
-         ...props.$props,
-         jsxAttributes: props.jsxAttributes,
-         children: props.children
-      };
-   }
-
-   return {...props};
-};
+export const flattenProps = (props: any): any => {
+
+   if (!props) return {};
+
+   if (props.jsxSpread) {
+      props = {
+         ...props,
+         ...props.jsxSpread.reduce((acc: any, prop: any) => Object.assign(acc, prop), {})
+      };
+   }
+
+   if (props.$props !== undefined) {
+      props = {
+         ...props.$props,
+         jsxAttributes: props.jsxAttributes,
+         children: props.children
+      };
+   }
+
+   return {...props};
+};

package/src/ui/index.scss

@@ -1,2 +1,2 @@
-
-@use 'layout/index';
+
+@use 'layout/index';

package/src/ui/index.ts

@@ -1,51 +1,51 @@
-export * from "./Prop";
-export * from "./Controller";
-export * from "./Widget";
-export * from "./Container";
-export * from "./PureContainer";
-export * from "./Repeater";
-export * from "./Rescope";
-export * from "./StaticText";
-export * from "./Text";
-export * from "./CSS";
-export * from "./CSSHelper";
-export * from "./FocusManager";
-export * from "./ResizeManager";
-export * from "./ZIndexManager";
-export * from "./Format";
-export * from "./Culture";
-export * from "./Localization";
-export * from "./Cx";
-export * from "./Instance";
-export * from "./RenderingContext";
-export * from "./ContentResolver";
-export * from "./batchUpdates";
-export * from "./IsolatedScope";
-export * from "./DetachedScope";
-export * from "./Restate";
-export * from "./DataProxy";
-export * from "./keyboardShortcuts";
-export * from "./StructuredInstanceDataAccessor";
-export * from "./HoverSync";
-
-export * from "./createFunctionalComponent";
-export * from "./flattenProps";
-
-export * from "./selection/index";
-export * from "./layout/index";
-export * from "./app/index";
-export * from "./adapter/index";
-
-export * from "./bind";
-export * from "./tpl";
-export * from "./expr";
-export * from "./exprHelpers";
-
-//re-export computable here
-import { computable } from "../data/computable";
-import {
-   createAccessorModelProxy,
-   createModel,
-   AccessorChain,
-} from "../data/createAccessorModelProxy";
-export { computable, createAccessorModelProxy, createModel, AccessorChain };
+export * from "./Prop";
+export * from "./Controller";
+export * from "./Widget";
+export * from "./Container";
+export * from "./PureContainer";
+export * from "./Repeater";
+export * from "./Rescope";
+export * from "./StaticText";
+export * from "./Text";
+export * from "./CSS";
+export * from "./CSSHelper";
+export * from "./FocusManager";
+export * from "./ResizeManager";
+export * from "./ZIndexManager";
+export * from "./Format";
+export * from "./Culture";
+export * from "./Localization";
+export * from "./Cx";
+export * from "./Instance";
+export * from "./RenderingContext";
+export * from "./ContentResolver";
+export * from "./batchUpdates";
+export * from "./IsolatedScope";
+export * from "./DetachedScope";
+export * from "./Restate";
+export * from "./DataProxy";
+export * from "./keyboardShortcuts";
+export * from "./StructuredInstanceDataAccessor";
+export * from "./HoverSync";
+
+export * from "./createFunctionalComponent";
+export * from "./flattenProps";
+
+export * from "./selection/index";
+export * from "./layout/index";
+export * from "./app/index";
+export * from "./adapter/index";
+
+export * from "./bind";
+export * from "./tpl";
+export * from "./expr";
+export * from "./exprHelpers";
+
+//re-export computable here
+import { computable } from "../data/computable";
+import {
+   createAccessorModelProxy,
+   createModel,
+   AccessorChain,
+} from "../data/createAccessorModelProxy";
+export { computable, createAccessorModelProxy, createModel, AccessorChain };

package/src/ui/keyboardShortcuts.ts

@@ -1,50 +1,50 @@
-import { SubscriberList } from "../util/SubscriberList";
-import { isObject } from "../util/isObject";
-
-interface KeyDescriptor {
-   keyCode: number;
-   shiftKey?: boolean;
-   ctrlKey?: boolean;
-   altKey?: boolean;
-}
-
-export type KeyboardShortcut = number | KeyDescriptor;
-
-let subscribers: any,
-   eventBan = 0;
-
-export function executeKeyboardShortcuts(e: KeyboardEvent) {
-   if (Date.now() < eventBan) return;
-   // Avoid duplicate executions as event.stopPropagation() for React events does not stop native events
-   eventBan = Date.now() + 5;
-   subscribers && subscribers.notify(e);
-}
-
-export function registerKeyboardShortcut(
-   key: number | KeyDescriptor,
-   callback: (e: KeyboardEvent) => void,
-) {
-   const keyCode = isObject(key) ? (key as KeyDescriptor).keyCode : key;
-   const shiftKey = isObject(key) ? (key as KeyDescriptor).shiftKey : false;
-   const ctrlKey = isObject(key) ? (key as KeyDescriptor).ctrlKey : false;
-   const altKey = isObject(key) ? (key as KeyDescriptor).altKey : false;
-
-   if (!subscribers) {
-      subscribers = new SubscriberList();
-      if (typeof document !== "undefined") {
-         document.addEventListener("keydown", (e: any) => {
-            if (e.target == document.body) executeKeyboardShortcuts(e);
-         });
-      }
-   }
-
-   return subscribers.subscribe((e: any) => {
-      if (
-         e.keyCode == keyCode &&
-         (!shiftKey || e.shiftKey) &&
-         (!ctrlKey || e.ctrlKey) &&
-         (!altKey || e.altKey)
-      )
-         callback(e);
-   });
-}
+import { SubscriberList } from "../util/SubscriberList";
+import { isObject } from "../util/isObject";
+
+interface KeyDescriptor {
+   keyCode: number;
+   shiftKey?: boolean;
+   ctrlKey?: boolean;
+   altKey?: boolean;
+}
+
+export type KeyboardShortcut = number | KeyDescriptor;
+
+let subscribers: any,
+   eventBan = 0;
+
+export function executeKeyboardShortcuts(e: KeyboardEvent) {
+   if (Date.now() < eventBan) return;
+   // Avoid duplicate executions as event.stopPropagation() for React events does not stop native events
+   eventBan = Date.now() + 5;
+   subscribers && subscribers.notify(e);
+}
+
+export function registerKeyboardShortcut(
+   key: number | KeyDescriptor,
+   callback: (e: KeyboardEvent) => void,
+) {
+   const keyCode = isObject(key) ? (key as KeyDescriptor).keyCode : key;
+   const shiftKey = isObject(key) ? (key as KeyDescriptor).shiftKey : false;
+   const ctrlKey = isObject(key) ? (key as KeyDescriptor).ctrlKey : false;
+   const altKey = isObject(key) ? (key as KeyDescriptor).altKey : false;
+
+   if (!subscribers) {
+      subscribers = new SubscriberList();
+      if (typeof document !== "undefined") {
+         document.addEventListener("keydown", (e: any) => {
+            if (e.target == document.body) executeKeyboardShortcuts(e);
+         });
+      }
+   }
+
+   return subscribers.subscribe((e: any) => {
+      if (
+         e.keyCode == keyCode &&
+         (!shiftKey || e.shiftKey) &&
+         (!ctrlKey || e.ctrlKey) &&
+         (!altKey || e.altKey)
+      )
+         callback(e);
+   });
+}

package/src/ui/layout/Content.ts

@@ -1,30 +1,30 @@
-import { Widget } from "../Widget";
-import { PureContainerBase, PureContainerConfig } from "../PureContainer";
-import { Instance } from "../Instance";
-
-export interface ContentConfig extends PureContainerConfig {
-   /** Placeholder name where the content is rendered. */
-   name?: string;
-
-   /** Placeholder name where the content is rendered. */
-   for?: string;
-}
-
-export class Content extends PureContainerBase<ContentConfig, Instance> {
-   declare name?: string;
-   declare for?: string;
-
-   constructor(config?: ContentConfig) {
-      super(config);
-   }
-
-   init(): void {
-      super.init();
-      if (!this.putInto) this.putInto = this.for || this.name;
-   }
-}
-
-Content.prototype.name = "body";
-Content.prototype.isContent = true;
-
-Widget.alias("content", Content);
+import { Widget } from "../Widget";
+import { PureContainerBase, PureContainerConfig } from "../PureContainer";
+import { Instance } from "../Instance";
+
+export interface ContentConfig extends PureContainerConfig {
+   /** Placeholder name where the content is rendered. */
+   name?: string;
+
+   /** Placeholder name where the content is rendered. */
+   for?: string;
+}
+
+export class Content extends PureContainerBase<ContentConfig, Instance> {
+   declare name?: string;
+   declare for?: string;
+
+   constructor(config?: ContentConfig) {
+      super(config);
+   }
+
+   init(): void {
+      super.init();
+      if (!this.putInto) this.putInto = this.for || this.name;
+   }
+}
+
+Content.prototype.name = "body";
+Content.prototype.isContent = true;
+
+Widget.alias("content", Content);