cx 24.11.4 → 25.1.1

package/src/ui/HoverSync.js

@@ -1,147 +1,147 @@
-/*
-   HoverSync transfers through the context methods for reporting and subscribing to hover data to
-   its descendants. How this should work is that each component can subscribe and unsubscribe
-   to a hover channel and receive info about hover changes.
-   Also, each component should report mouse enter/leave events.
-   Similar to controllers, hover sync should transcend into child contexts.
-*/
-
-import { dummyCallback } from "../util/dummyCallback";
-import { parseStyle } from "../util/parseStyle";
-import { SubscriberList } from "../util/SubscriberList";
-import { Container } from "./Container";
-import { PureContainer } from "./PureContainer";
-import { VDOM } from "./VDOM";
-
-export class HoverSync extends PureContainer {
-   initInstance(context, instance) {
-      let channels = {};
-      instance.hoverSync = {
-         report: (channel, hoverId, active) => {
-            let ch = channels[channel];
-            if (!ch) return;
-            let state = active && hoverId;
-            if (ch.state !== state && (ch.state === hoverId || active)) {
-               ch.state = state;
-               ch.subscribers.notify(state);
-            }
-         },
-         subscribe: (channel, callback) => {
-            let ch = channels[channel];
-            if (!ch)
-               ch = channels[channel] = {
-                  subscribers: new SubscriberList(),
-                  state: false,
-               };
-            return ch.subscribers.subscribe(callback);
-         },
-      };
-   }
-
-   explore(context, instance) {
-      context.push("hoverSync", instance.hoverSync);
-      super.explore(context, instance);
-   }
-
-   exploreCleanup(context, instance) {
-      context.pop("hoverSync");
-   }
-}
-
-class HoverSyncChild extends VDOM.Component {
-   constructor(props) {
-      super(props);
-      this.state = { hover: false };
-      this.onMouseMove = this.onMouseMove.bind(this);
-      this.onMouseLeave = this.onMouseLeave.bind(this);
-   }
-
-   onMouseMove() {
-      this.props.hoverSync.report(this.props.hoverChannel, this.props.hoverId, true);
-   }
-
-   onMouseLeave() {
-      this.props.hoverSync.report(this.props.hoverChannel, this.props.hoverId, false);
-   }
-
-   compontentWillUnmount() {
-      this.unsubscribe();
-   }
-
-   componentDidMount() {
-      this.unsubscribe = this.props.hoverSync.subscribe(this.props.hoverChannel, (hoverId) => {
-         let hover = hoverId === this.props.hoverId;
-         if (hover !== this.state.hover) this.setState({ hover });
-      });
-   }
-
-   render() {
-      return this.props.render({
-         hover: this.state.hover,
-         onMouseLeave: this.onMouseLeave,
-         onMouseMove: this.onMouseMove,
-         key: "child",
-      });
-   }
-}
-
-export function withHoverSync(key, hoverSync, hoverChannel, hoverId, render) {
-   if (!hoverSync || !hoverChannel || hoverId == null)
-      return render({ key, hover: false, onMouseLeave: dummyCallback, onMouseMove: dummyCallback });
-   return (
-      <HoverSyncChild key={key} hoverSync={hoverSync} hoverChannel={hoverChannel} hoverId={hoverId} render={render} />
-   );
-}
-
-export class HoverSyncElement extends Container {
-   declareData(...args) {
-      super.declareData(...args, {
-         hoverId: undefined,
-         hoverClass: { structured: true },
-         hoverStyle: { structured: true },
-      });
-   }
-
-   prepareData(context, instance) {
-      instance.hoverSync = context.hoverSync;
-      instance.inSvg = !!context.inSvg;
-      let { data } = instance;
-      data.hoverStyle = parseStyle(data.hoverStyle);
-      super.prepareData(context, instance);
-   }
-
-   render(context, instance, key) {
-      let { data, inSvg } = instance;
-      let { CSS } = this;
-      let children = this.renderChildren(context, instance);
-      let eventHandlers = instance.getJsxEventProps();
-      return withHoverSync(
-         key,
-         instance.hoverSync,
-         this.hoverChannel,
-         data.hoverId,
-         ({ hover, onMouseMove, onMouseLeave, key }) => {
-            let style = {
-               ...data.style,
-               ...(hover && data.hoverStyle),
-            };
-            return VDOM.createElement(
-               inSvg ? "g" : "div",
-               {
-                  key,
-                  className: CSS.expand(data.classNames, CSS.state({ hover }), hover && data.hoverClass),
-                  style,
-                  ...eventHandlers,
-                  onMouseLeave,
-                  onMouseMove,
-               },
-               children
-            );
-         }
-      );
-   }
-}
-
-HoverSyncElement.prototype.baseClass = "hoversyncelement";
-HoverSyncElement.prototype.styled = true;
-HoverSyncElement.prototype.hoverChannel = "default";
+/*
+   HoverSync transfers through the context methods for reporting and subscribing to hover data to
+   its descendants. How this should work is that each component can subscribe and unsubscribe
+   to a hover channel and receive info about hover changes.
+   Also, each component should report mouse enter/leave events.
+   Similar to controllers, hover sync should transcend into child contexts.
+*/
+
+import { dummyCallback } from "../util/dummyCallback";
+import { parseStyle } from "../util/parseStyle";
+import { SubscriberList } from "../util/SubscriberList";
+import { Container } from "./Container";
+import { PureContainer } from "./PureContainer";
+import { VDOM } from "./VDOM";
+
+export class HoverSync extends PureContainer {
+   initInstance(context, instance) {
+      let channels = {};
+      instance.hoverSync = {
+         report: (channel, hoverId, active) => {
+            let ch = channels[channel];
+            if (!ch) return;
+            let state = active && hoverId != null;
+            if (ch.state !== state && (ch.state === hoverId || active)) {
+               ch.state = state;
+               ch.subscribers.notify(state);
+            }
+         },
+         subscribe: (channel, callback) => {
+            let ch = channels[channel];
+            if (!ch)
+               ch = channels[channel] = {
+                  subscribers: new SubscriberList(),
+                  state: false,
+               };
+            return ch.subscribers.subscribe(callback);
+         },
+      };
+   }
+
+   explore(context, instance) {
+      context.push("hoverSync", instance.hoverSync);
+      super.explore(context, instance);
+   }
+
+   exploreCleanup(context, instance) {
+      context.pop("hoverSync");
+   }
+}
+
+class HoverSyncChild extends VDOM.Component {
+   constructor(props) {
+      super(props);
+      this.state = { hover: false };
+      this.onMouseMove = this.onMouseMove.bind(this);
+      this.onMouseLeave = this.onMouseLeave.bind(this);
+   }
+
+   onMouseMove() {
+      this.props.hoverSync.report(this.props.hoverChannel, this.props.hoverId, true);
+   }
+
+   onMouseLeave() {
+      this.props.hoverSync.report(this.props.hoverChannel, this.props.hoverId, false);
+   }
+
+   compontentWillUnmount() {
+      this.unsubscribe();
+   }
+
+   componentDidMount() {
+      this.unsubscribe = this.props.hoverSync.subscribe(this.props.hoverChannel, (hoverId) => {
+         let hover = hoverId === this.props.hoverId;
+         if (hover !== this.state.hover) this.setState({ hover });
+      });
+   }
+
+   render() {
+      return this.props.render({
+         hover: this.state.hover,
+         onMouseLeave: this.onMouseLeave,
+         onMouseMove: this.onMouseMove,
+         key: "child",
+      });
+   }
+}
+
+export function withHoverSync(key, hoverSync, hoverChannel, hoverId, render) {
+   if (!hoverSync || !hoverChannel || hoverId == null)
+      return render({ key, hover: false, onMouseLeave: dummyCallback, onMouseMove: dummyCallback });
+   return (
+      <HoverSyncChild key={key} hoverSync={hoverSync} hoverChannel={hoverChannel} hoverId={hoverId} render={render} />
+   );
+}
+
+export class HoverSyncElement extends Container {
+   declareData(...args) {
+      super.declareData(...args, {
+         hoverId: undefined,
+         hoverClass: { structured: true },
+         hoverStyle: { structured: true },
+      });
+   }
+
+   prepareData(context, instance) {
+      instance.hoverSync = context.hoverSync;
+      instance.inSvg = !!context.inSvg;
+      let { data } = instance;
+      data.hoverStyle = parseStyle(data.hoverStyle);
+      super.prepareData(context, instance);
+   }
+
+   render(context, instance, key) {
+      let { data, inSvg } = instance;
+      let { CSS } = this;
+      let children = this.renderChildren(context, instance);
+      let eventHandlers = instance.getJsxEventProps();
+      return withHoverSync(
+         key,
+         instance.hoverSync,
+         this.hoverChannel,
+         data.hoverId,
+         ({ hover, onMouseMove, onMouseLeave, key }) => {
+            let style = {
+               ...data.style,
+               ...(hover && data.hoverStyle),
+            };
+            return VDOM.createElement(
+               inSvg ? "g" : "div",
+               {
+                  key,
+                  className: CSS.expand(data.classNames, CSS.state({ hover }), hover && data.hoverClass),
+                  style,
+                  ...eventHandlers,
+                  onMouseLeave,
+                  onMouseMove,
+               },
+               children,
+            );
+         },
+      );
+   }
+}
+
+HoverSyncElement.prototype.baseClass = "hoversyncelement";
+HoverSyncElement.prototype.styled = true;
+HoverSyncElement.prototype.hoverChannel = "default";

package/src/util/Format.js

@@ -4,6 +4,7 @@ import { isNumber } from "../util/isNumber";
 import { isUndefined } from "../util/isUndefined";
 import { isArray } from "../util/isArray";
 import { capitalize } from "./capitalize";
+import { parseDateInvariant } from "./date/parseDateInvariant";
 
 //Culture dependent formatters are defined in the ui package.
 
@@ -75,14 +76,14 @@ let formatFactory = {
 
    date: function () {
       return (value) => {
-         let date = new Date(value);
+         let date = parseDateInvariant(value);
          return `${date.getMonth() + 1}/${date.getDate()}/${date.getFullYear()}`;
       };
    },
 
    time: function () {
       return (value) => {
-         let date = new Date(value);
+         let date = parseDateInvariant(value);
          let h = date.getHours() >= 10 ? date.getHours() : "0" + date.getHours();
          let m = date.getMinutes() >= 10 ? date.getMinutes() : "0" + date.getMinutes();
          return `${h}:${m}`;

package/src/util/date/encodeDate.d.ts

@@ -0,0 +1 @@
+export function encodeDate(date: Date): string;

package/src/util/date/encodeDate.js

@@ -0,0 +1,8 @@
+function pad(num) {
+   const norm = Math.floor(Math.abs(num));
+   return (norm < 10 ? "0" : "") + norm;
+}
+
+export function encodeDate(date) {
+   return date.getFullYear() + "-" + pad(date.getMonth() + 1) + "-" + pad(date.getDate());
+}

package/src/util/date/encodeDateWithTimezoneOffset.d.ts

@@ -1 +1 @@
-export function encodeDateWithTimezoneOffset(date);
+export function encodeDateWithTimezoneOffset(date: Date): string;

package/src/util/date/index.d.ts

@@ -1,9 +1,11 @@
-export * from './dateDiff';
-export * from './zeroTime';
-export * from './monthStart';
-export * from './lowerBoundCheck';
-export * from './upperBoundCheck';
-export * from './maxDate';
-export * from './minDate';
-export * from './sameDate';
-export * from './encodeDateWithTimezoneOffset';
+export * from "./dateDiff";
+export * from "./zeroTime";
+export * from "./monthStart";
+export * from "./lowerBoundCheck";
+export * from "./upperBoundCheck";
+export * from "./maxDate";
+export * from "./minDate";
+export * from "./sameDate";
+export * from "./encodeDateWithTimezoneOffset";
+export * from "./encodeDate";
+export * from "./parseDateInvariant";

package/src/util/date/index.js

@@ -1,9 +1,11 @@
-export * from './dateDiff';
-export * from './zeroTime';
-export * from './monthStart';
-export * from './lowerBoundCheck';
-export * from './upperBoundCheck';
-export * from './maxDate';
-export * from './minDate';
-export * from './sameDate';
-export * from './encodeDateWithTimezoneOffset';
+export * from "./dateDiff";
+export * from "./zeroTime";
+export * from "./monthStart";
+export * from "./lowerBoundCheck";
+export * from "./upperBoundCheck";
+export * from "./maxDate";
+export * from "./minDate";
+export * from "./sameDate";
+export * from "./encodeDateWithTimezoneOffset";
+export * from "./encodeDate";
+export * from "./parseDateInvariant";

package/src/util/date/parseDateInvariant.d.ts

@@ -0,0 +1,3 @@
+export function parseDateInvariant(input: string | number | Date): Date;
+
+export function overrideParseDateInvariant(newImpl: (input: string | number | Date) => Date): void;

package/src/util/date/parseDateInvariant.js

@@ -0,0 +1,20 @@
+// This module addresses a common issue when handling date strings in the format "yyyy-MM-dd" usually returned by backends.
+// In time zones earlier than UTC, creating a Date object from such a string can result in the date being shifted one day earlier.
+// This happens because "yyyy-MM-dd" is interpreted as a UTC date at 00:00, and when the browser displays it in local time, it adjusts backward.
+// To resolve this, the default implementation (`defaultInvariantParseDate`) appends " 00:00" to the date string,
+// explicitly indicating local time. Custom parsing logic can also be registered dynamically using `registerInvariantParseDateImpl`
+// to accommodate other formats or requirements.
+function defaultParseDateInvariant(input) {
+   if (typeof input == "string" && input.length == 10 && input[4] == "-" && input[7] == "-")
+      return new Date(`${input} 00:00`);
+   return new Date(input);
+}
+let impl = defaultParseDateInvariant;
+
+export function parseDateInvariant(input) {
+   return impl(input);
+}
+
+export function overrideParseDateInvariant(newImpl) {
+   impl = newImpl;
+}