cx 25.10.1 → 25.11.1

package/src/widgets/drag-drop/DragSource.d.ts

@@ -1,45 +1,45 @@
-import * as Cx from "../../core";
-import { Instance } from "../../ui/Instance";
-
-interface DragSourceProps extends Cx.StyledContainerProps {
-   /**
-    * Data about the drag source that can be used by drop zones to test if
-    * drag source is acceptable and to perform drop operations.
-    */
-   data?: any;
-
-   /**
-    * Set to true to hide the element while being dragged.
-    * Use if drop zones are configured to expand to indicate where drop will occur.
-    */
-   hideOnDrag?: boolean;
-
-   /** Set to true to indicate that this drag source can be dragged only by using an inner DragHandle. */
-   handled?: boolean;
-
-   /** Base CSS class to be applied to the element. Defaults to 'dragsource'. */
-   baseClass?: string;
-
-   onDragStart?: (e, instance: Instance) => any;
-
-   onDragEnd?: (e, instance: Instance) => void;
-
-   id?: Cx.StringProp;
-
-   /** Custom contents to be displayed during drag & drop operation. */
-   clone?: Cx.Config;
-
-   /** CSS styles to be applied to the clone of the element being dragged. */
-   cloneStyle?: Cx.StyleProp;
-
-   /** CSS styles to be applied to the element being dragged. */
-   draggedStyle?: Cx.StyleProp;
-
-   /** Additional CSS class to be applied to the clone of the element being dragged. */
-   cloneClass?: Cx.ClassProp;
-
-   /** Additional CSS class to be applied to the element being dragged. */
-   draggedClass?: Cx.ClassProp;
-}
-
-export class DragSource extends Cx.Widget<DragSourceProps> {}
+import * as Cx from "../../core";
+import { Instance } from "../../ui/Instance";
+
+interface DragSourceProps extends Cx.StyledContainerProps {
+   /**
+    * Data about the drag source that can be used by drop zones to test if
+    * drag source is acceptable and to perform drop operations.
+    */
+   data?: any;
+
+   /**
+    * Set to true to hide the element while being dragged.
+    * Use if drop zones are configured to expand to indicate where drop will occur.
+    */
+   hideOnDrag?: boolean;
+
+   /** Set to true to indicate that this drag source can be dragged only by using an inner DragHandle. */
+   handled?: boolean;
+
+   /** Base CSS class to be applied to the element. Defaults to 'dragsource'. */
+   baseClass?: string;
+
+   onDragStart?: (e, instance: Instance) => any;
+
+   onDragEnd?: (e, instance: Instance) => void;
+
+   id?: Cx.StringProp;
+
+   /** Custom contents to be displayed during drag & drop operation. */
+   clone?: Cx.Config;
+
+   /** CSS styles to be applied to the clone of the element being dragged. */
+   cloneStyle?: Cx.StyleProp;
+
+   /** CSS styles to be applied to the element being dragged. */
+   draggedStyle?: Cx.StyleProp;
+
+   /** Additional CSS class to be applied to the clone of the element being dragged. */
+   cloneClass?: Cx.ClassProp;
+
+   /** Additional CSS class to be applied to the element being dragged. */
+   draggedClass?: Cx.ClassProp;
+}
+
+export class DragSource extends Cx.Widget<DragSourceProps> {}

package/src/widgets/drag-drop/DropZone.d.ts

@@ -1,98 +1,98 @@
-import * as Cx from "../../core";
-
-import { Instance } from "../../ui/Instance";
-import { DragEvent } from "./ops";
-
-interface DropZoneProps extends Cx.StyledContainerProps {
-   /** CSS styles to be applied when drag cursor is over the drop zone. */
-   overStyle?: Cx.StyleProp;
-
-   /** CSS styles to be applied when drag cursor is near the drop zone. */
-   nearStyle?: Cx.StyleProp;
-
-   /** CSS styles to be applied when drag operations begin used to highlight drop zones. */
-   farStyle?: Cx.StyleProp;
-
-   /** Additional CSS class to be applied when drag cursor is over the drop zone. */
-   overClass?: Cx.ClassProp;
-
-   /** Additional CSS class to be applied when drag cursor is near the drop zone. */
-   nearClass?: Cx.ClassProp;
-
-   /** Additional CSS class to be applied when drag operations begin used to highlight drop zones. */
-   farClass?: Cx.ClassProp;
-
-   /** Distance in `px` used to determine if cursor is near the dropzone. If not configured, cursor is never considered near. */
-   nearDistance?: number;
-
-   /** Bindable data related to the DropZone that might be useful inside onDrop operations. */
-   data?: Cx.StructuredProp;
-
-   /**
-    * Inflate the drop zone's bounding box so it activates on cursor proximity.
-    * Useful for invisible drop-zones that are only a few pixels tall/wide.
-    */
-   inflate?: number;
-
-   /**
-    * Inflate the drop zone's bounding box horizontally so it activates on cursor proximity.
-    * Useful for invisible drop-zones that are only a few pixels tall/wide.
-    */
-   hinflate?: number;
-
-   /**
-    * Inflate the drop zone's bounding box vertically so it activates on cursor proximity.
-    * Useful for invisible drop-zones that are only a few pixels tall/wide.
-    */
-   vinflate?: number;
-
-   /** Base CSS class to be applied to the element. Defaults to 'dropzone'. */
-   baseClass?: string;
-
-   /** A callback method invoked when dragged item is finally dropped.
-    The callback takes two arguments:
-    * dragDropEvent - An object containing information related to the source
-    * instance
-    Return value is written into dragDropEvent.result and can be passed
-    to the source's onDragEnd callback. */
-   onDrop?: string | ((event?: DragEvent, instance?: Instance) => any);
-
-   /** A callback method used to test if dragged item (source) is compatible
-    with the drop zone. */
-   onDropTest?: string | ((event?: DragEvent, instance?: Instance) => boolean);
-
-   /** A callback method invoked when the dragged item gets close to the drop zone.
-    See also `nearDistance`. */
-   onDragNear?: string | ((event?: DragEvent, instance?: Instance) => void);
-
-   /** A callback method invoked when the dragged item is dragged away. */
-   onDragAway?: string | ((event?: DragEvent, instance?: Instance) => void);
-
-   /** A callback method invoked when the dragged item is dragged over the drop zone.
-    The callback is called for each `mousemove` or `touchmove` event. */
-   onDragOver?: string | ((event?: DragEvent, instance?: Instance) => void);
-
-   /** A callback method invoked when the dragged item is dragged over the drop zone
-    for the first time. */
-   onDragEnter?: string | ((event?: DragEvent, instance?: Instance) => void);
-
-   /** A callback method invoked when the dragged item leaves the drop zone area. */
-   onDragLeave?: string | ((event?: DragEvent, instance?: Instance) => void);
-
-   /** A callback method invoked when at the beginning of the drag & drop operation. */
-   onDragStart?: string | ((event?: DragEvent, instance?: Instance) => void);
-
-   /** A callback method invoked when at the end of the drag & drop operation. */
-   onDragEnd?: string | ((event?: DragEvent, instance?: Instance) => void);
-
-   /** Match height of the item being dragged */
-   matchHeight?: boolean;
-
-   /** Match width of the item being dragged */
-   matchWidth?: boolean;
-
-   /** Match margin of the item being dragged */
-   matchMargin?: boolean;
-}
-
-export class DropZone extends Cx.Widget<DropZoneProps> {}
+import * as Cx from "../../core";
+
+import { Instance } from "../../ui/Instance";
+import { DragEvent } from "./ops";
+
+interface DropZoneProps extends Cx.StyledContainerProps {
+   /** CSS styles to be applied when drag cursor is over the drop zone. */
+   overStyle?: Cx.StyleProp;
+
+   /** CSS styles to be applied when drag cursor is near the drop zone. */
+   nearStyle?: Cx.StyleProp;
+
+   /** CSS styles to be applied when drag operations begin used to highlight drop zones. */
+   farStyle?: Cx.StyleProp;
+
+   /** Additional CSS class to be applied when drag cursor is over the drop zone. */
+   overClass?: Cx.ClassProp;
+
+   /** Additional CSS class to be applied when drag cursor is near the drop zone. */
+   nearClass?: Cx.ClassProp;
+
+   /** Additional CSS class to be applied when drag operations begin used to highlight drop zones. */
+   farClass?: Cx.ClassProp;
+
+   /** Distance in `px` used to determine if cursor is near the dropzone. If not configured, cursor is never considered near. */
+   nearDistance?: number;
+
+   /** Bindable data related to the DropZone that might be useful inside onDrop operations. */
+   data?: Cx.StructuredProp;
+
+   /**
+    * Inflate the drop zone's bounding box so it activates on cursor proximity.
+    * Useful for invisible drop-zones that are only a few pixels tall/wide.
+    */
+   inflate?: number;
+
+   /**
+    * Inflate the drop zone's bounding box horizontally so it activates on cursor proximity.
+    * Useful for invisible drop-zones that are only a few pixels tall/wide.
+    */
+   hinflate?: number;
+
+   /**
+    * Inflate the drop zone's bounding box vertically so it activates on cursor proximity.
+    * Useful for invisible drop-zones that are only a few pixels tall/wide.
+    */
+   vinflate?: number;
+
+   /** Base CSS class to be applied to the element. Defaults to 'dropzone'. */
+   baseClass?: string;
+
+   /** A callback method invoked when dragged item is finally dropped.
+    The callback takes two arguments:
+    * dragDropEvent - An object containing information related to the source
+    * instance
+    Return value is written into dragDropEvent.result and can be passed
+    to the source's onDragEnd callback. */
+   onDrop?: string | ((event?: DragEvent, instance?: Instance) => any);
+
+   /** A callback method used to test if dragged item (source) is compatible
+    with the drop zone. */
+   onDropTest?: string | ((event?: DragEvent, instance?: Instance) => boolean);
+
+   /** A callback method invoked when the dragged item gets close to the drop zone.
+    See also `nearDistance`. */
+   onDragNear?: string | ((event?: DragEvent, instance?: Instance) => void);
+
+   /** A callback method invoked when the dragged item is dragged away. */
+   onDragAway?: string | ((event?: DragEvent, instance?: Instance) => void);
+
+   /** A callback method invoked when the dragged item is dragged over the drop zone.
+    The callback is called for each `mousemove` or `touchmove` event. */
+   onDragOver?: string | ((event?: DragEvent, instance?: Instance) => void);
+
+   /** A callback method invoked when the dragged item is dragged over the drop zone
+    for the first time. */
+   onDragEnter?: string | ((event?: DragEvent, instance?: Instance) => void);
+
+   /** A callback method invoked when the dragged item leaves the drop zone area. */
+   onDragLeave?: string | ((event?: DragEvent, instance?: Instance) => void);
+
+   /** A callback method invoked when at the beginning of the drag & drop operation. */
+   onDragStart?: string | ((event?: DragEvent, instance?: Instance) => void);
+
+   /** A callback method invoked when at the end of the drag & drop operation. */
+   onDragEnd?: string | ((event?: DragEvent, instance?: Instance) => void);
+
+   /** Match height of the item being dragged */
+   matchHeight?: boolean;
+
+   /** Match width of the item being dragged */
+   matchWidth?: boolean;
+
+   /** Match margin of the item being dragged */
+   matchMargin?: boolean;
+}
+
+export class DropZone extends Cx.Widget<DropZoneProps> {}

package/src/widgets/drag-drop/index.d.ts

@@ -1,4 +1,4 @@
-export * from "./DragSource";
-export * from "./DragHandle";
-export * from "./DropZone";
-export * from "./ops";
+export * from "./DragSource";
+export * from "./DragHandle";
+export * from "./DropZone";
+export * from "./ops";

package/src/widgets/drag-drop/index.scss

@@ -1,4 +1,4 @@
-@import "DragSource";
-@import "DropZone";
-@import "DragHandle";
+@import "DragSource";
+@import "DropZone";
+@import "DragHandle";
 @import "DragClone";

package/src/widgets/drag-drop/ops.d.ts

@@ -1,57 +1,57 @@
-import * as Cx from '../../core';
-import * as React from 'react';
-import { CursorPosition } from '../overlay/captureMouse';
-import { View } from '../../data/View';
-
-export interface DragEvent {
-   type: 'dragstart' | 'dragmove' | 'dragdrop',
-   event: React.SyntheticEvent<any>,
-   cursor: CursorPosition,
-   source: {
-      width: number,
-      height: number,
-      margin: string[],
-      data?: any,
-      store: View,
-      [other: string]: any,
-   },
-   result?: any
-}
-
-interface DragDropOptions {
-   sourceEl?: Element,
-   clone?: any,
-   source?: Cx.Config,
-}
-
-type DragEventHandler = (e: DragEvent) => void;
-
-export interface IDropZone {
-   onDropTest?: (e: DragEvent) => boolean;
-   onDragStart?: DragEventHandler;
-   onDragAway?: DragEventHandler;
-   onDragEnd?: DragEventHandler;
-   onDragMeasure?: (e: DragEvent) => { over: boolean, near: boolean };
-   onDragLeave?: DragEventHandler;
-   onDragOver?: DragEventHandler;
-   onDragEnter?: DragEventHandler;
-   onDrop?: DragEventHandler;
-}
-
-type UnregisterFunction = () => void;
-
-/** Register a drop zone. Return value is a function that can be used to unregister the drop zone. */
-export function registerDropZone(dropZone: IDropZone) : UnregisterFunction;
-
-/** Initiate a drag-drop operation. */
-export function initiateDragDrop(e: DragEvent, options?: DragDropOptions, onDragEnd?: (e?: DragEvent) => void) : void;
-
-export function ddMouseDown(e: React.SyntheticEvent<any>) : void;
-
-export function ddMouseUp() : void;
-
-export function ddDetect(e: React.SyntheticEvent<any>) : void | true;
-
-export function ddHandle(e: React.SyntheticEvent<any>) : void;
-
+import * as Cx from '../../core';
+import * as React from 'react';
+import { CursorPosition } from '../overlay/captureMouse';
+import { View } from '../../data/View';
+
+export interface DragEvent {
+   type: 'dragstart' | 'dragmove' | 'dragdrop',
+   event: React.SyntheticEvent<any>,
+   cursor: CursorPosition,
+   source: {
+      width: number,
+      height: number,
+      margin: string[],
+      data?: any,
+      store: View,
+      [other: string]: any,
+   },
+   result?: any
+}
+
+interface DragDropOptions {
+   sourceEl?: Element,
+   clone?: any,
+   source?: Cx.Config,
+}
+
+type DragEventHandler = (e: DragEvent) => void;
+
+export interface IDropZone {
+   onDropTest?: (e: DragEvent) => boolean;
+   onDragStart?: DragEventHandler;
+   onDragAway?: DragEventHandler;
+   onDragEnd?: DragEventHandler;
+   onDragMeasure?: (e: DragEvent) => { over: boolean, near: boolean };
+   onDragLeave?: DragEventHandler;
+   onDragOver?: DragEventHandler;
+   onDragEnter?: DragEventHandler;
+   onDrop?: DragEventHandler;
+}
+
+type UnregisterFunction = () => void;
+
+/** Register a drop zone. Return value is a function that can be used to unregister the drop zone. */
+export function registerDropZone(dropZone: IDropZone) : UnregisterFunction;
+
+/** Initiate a drag-drop operation. */
+export function initiateDragDrop(e: DragEvent, options?: DragDropOptions, onDragEnd?: (e?: DragEvent) => void) : void;
+
+export function ddMouseDown(e: React.SyntheticEvent<any>) : void;
+
+export function ddMouseUp() : void;
+
+export function ddDetect(e: React.SyntheticEvent<any>) : void | true;
+
+export function ddHandle(e: React.SyntheticEvent<any>) : void;
+
 export function isDragHandleEvent(e: React.SyntheticEvent<any>) : boolean;

package/src/widgets/enableAllInternalDependencies.d.ts

@@ -1 +1 @@
-export function enableAllInternalDependencies();
+export function enableAllInternalDependencies();

package/src/widgets/form/Calendar.variables.scss

@@ -1,64 +1,64 @@
-
-$cx-default-calendar-font-size: $cx-default-box-font-size !default;
-$cx-default-calendar-background-color: $cx-default-input-background-color !default;
-$cx-default-calendar-border-width: $cx-default-box-border-width !default;
-$cx-default-calendar-border-color: $cx-default-input-border-color !default;
-$cx-default-calendar-border-radius: $cx-default-border-radius !default;
-$cx-default-calendar-box-shadow: none !default;
-$cx-default-calendar-padding: 5px !default;
-
-//header
-$cx-default-calendar-header-font-size: $cx-default-box-font-size !default;
-$cx-default-calendar-header-font-weight: 500 !default;
-$cx-default-calendar-header-color: $cx-default-color !default;
-$cx-default-calendar-header-background-color: transparent !default;
-
-//day
-$cx-default-calendar-day-font-size: $cx-default-calendar-font-size !default;
-$cx-default-calendar-day-border-radius: $cx-default-calendar-border-radius !default;
-
-// CALENDAR
-$cx-calendar-state-style-map: cx-deep-map-merge($cx-input-state-style-map, (
-  default: (
-    font-size: $cx-default-calendar-font-size,
-    background-color: $cx-default-calendar-background-color,
-    border-style: solid,
-    border-width: $cx-default-calendar-border-width,
-    border-color: $cx-default-calendar-border-color,
-    border-radius: $cx-default-calendar-border-radius,
-    box-shadow: $cx-default-calendar-box-shadow,
-    padding: $cx-default-calendar-padding
-  ),
-  hover: (
-    
-  ),
-  header: (
-    font-size: $cx-default-calendar-header-font-size,
-    font-weight: $cx-default-calendar-header-font-weight,
-    color: $cx-default-calendar-header-color,
-    background-color: $cx-default-calendar-header-background-color, 
-  ),
-  focus: (
-    border-color: cx-get-state-rule($cx-input-state-style-map, focus, border-color),
-    box-shadow: cx-get-state-rule($cx-input-state-style-map, focus, box-shadow),
-    outline: none
-  )
-)) !default;
-
-// calendar day field styles
-$cx-calendar-day-state-style-map: cx-deep-map-merge($cx-list-item, (
-  default: (
-    font-size: $cx-default-calendar-day-font-size,
-    background-color: transparent,
-    border-radius: $cx-default-calendar-day-border-radius
-  ),
-  today: (
-    background-color: rgba(220, 250, 183, 0.5),
-  ),
-  outside: (
-    color: rgba(0, 0, 0, 0.3)
-  ), 
-  today-hover: (
-      
-  )
+
+$cx-default-calendar-font-size: $cx-default-box-font-size !default;
+$cx-default-calendar-background-color: $cx-default-input-background-color !default;
+$cx-default-calendar-border-width: $cx-default-box-border-width !default;
+$cx-default-calendar-border-color: $cx-default-input-border-color !default;
+$cx-default-calendar-border-radius: $cx-default-border-radius !default;
+$cx-default-calendar-box-shadow: none !default;
+$cx-default-calendar-padding: 5px !default;
+
+//header
+$cx-default-calendar-header-font-size: $cx-default-box-font-size !default;
+$cx-default-calendar-header-font-weight: 500 !default;
+$cx-default-calendar-header-color: $cx-default-color !default;
+$cx-default-calendar-header-background-color: transparent !default;
+
+//day
+$cx-default-calendar-day-font-size: $cx-default-calendar-font-size !default;
+$cx-default-calendar-day-border-radius: $cx-default-calendar-border-radius !default;
+
+// CALENDAR
+$cx-calendar-state-style-map: cx-deep-map-merge($cx-input-state-style-map, (
+  default: (
+    font-size: $cx-default-calendar-font-size,
+    background-color: $cx-default-calendar-background-color,
+    border-style: solid,
+    border-width: $cx-default-calendar-border-width,
+    border-color: $cx-default-calendar-border-color,
+    border-radius: $cx-default-calendar-border-radius,
+    box-shadow: $cx-default-calendar-box-shadow,
+    padding: $cx-default-calendar-padding
+  ),
+  hover: (
+    
+  ),
+  header: (
+    font-size: $cx-default-calendar-header-font-size,
+    font-weight: $cx-default-calendar-header-font-weight,
+    color: $cx-default-calendar-header-color,
+    background-color: $cx-default-calendar-header-background-color, 
+  ),
+  focus: (
+    border-color: cx-get-state-rule($cx-input-state-style-map, focus, border-color),
+    box-shadow: cx-get-state-rule($cx-input-state-style-map, focus, box-shadow),
+    outline: none
+  )
+)) !default;
+
+// calendar day field styles
+$cx-calendar-day-state-style-map: cx-deep-map-merge($cx-list-item, (
+  default: (
+    font-size: $cx-default-calendar-day-font-size,
+    background-color: transparent,
+    border-radius: $cx-default-calendar-day-border-radius
+  ),
+  today: (
+    background-color: rgba(220, 250, 183, 0.5),
+  ),
+  outside: (
+    color: rgba(0, 0, 0, 0.3)
+  ), 
+  today-hover: (
+      
+  )
 ));

package/src/widgets/form/Checkbox.variables.scss

@@ -1,40 +1,40 @@
-
-$cx-default-checkbox-color: $cx-default-input-color !default;
-$cx-default-checkbox-background-color: $cx-default-input-background-color !default;
-$cx-default-checkbox-border-width: cx-get-state-rule($cx-input-state-style-map, default, border-width) !default;
-$cx-default-checkbox-border-color: $cx-default-input-border-color !default;
-
-$cx-checkbox-state-style-map: cx-deep-map-merge($cx-input-state-style-map, (
-  default: (
-    color: $cx-default-checkbox-color,
-    background-color: $cx-default-checkbox-background-color,
-    border-width: $cx-default-checkbox-border-width,
-    border-color: $cx-default-checkbox-border-color
-  ),
-  checked: (
-
-  ),
-  checked-focus: (
-    
-  ),
-  focus: (
-    border-color: cx-get-state-rule($cx-input-state-style-map, focus, border-color),
-    outline: cx-get-state-rule($cx-input-state-style-map, focus, outline),
-    box-shadow: cx-get-state-rule($cx-input-state-style-map, focus, box-shadow)
-  ),
-
-  disabled: (
-    background: rgb(235, 235, 228),
-    color: rgb(84, 84, 84)
-  ),
-  disabled-checked: (
-    
-  ),
-  error: (
-    border-color: rgba(220, 0, 9, 0.8)
-  ),
-
-  error-focus: (
-    box-shadow: 0 0 2px rgba(220, 0, 9, 0.8)
-  )
+
+$cx-default-checkbox-color: $cx-default-input-color !default;
+$cx-default-checkbox-background-color: $cx-default-input-background-color !default;
+$cx-default-checkbox-border-width: cx-get-state-rule($cx-input-state-style-map, default, border-width) !default;
+$cx-default-checkbox-border-color: $cx-default-input-border-color !default;
+
+$cx-checkbox-state-style-map: cx-deep-map-merge($cx-input-state-style-map, (
+  default: (
+    color: $cx-default-checkbox-color,
+    background-color: $cx-default-checkbox-background-color,
+    border-width: $cx-default-checkbox-border-width,
+    border-color: $cx-default-checkbox-border-color
+  ),
+  checked: (
+
+  ),
+  checked-focus: (
+    
+  ),
+  focus: (
+    border-color: cx-get-state-rule($cx-input-state-style-map, focus, border-color),
+    outline: cx-get-state-rule($cx-input-state-style-map, focus, outline),
+    box-shadow: cx-get-state-rule($cx-input-state-style-map, focus, box-shadow)
+  ),
+
+  disabled: (
+    background: rgb(235, 235, 228),
+    color: rgb(84, 84, 84)
+  ),
+  disabled-checked: (
+    
+  ),
+  error: (
+    border-color: rgba(220, 0, 9, 0.8)
+  ),
+
+  error-focus: (
+    box-shadow: 0 0 2px rgba(220, 0, 9, 0.8)
+  )
 )) !default;