bm-core-ui 2.11.8 → 2.11.9-beta.1

package/build/@types/index.d.ts

@@ -13707,6 +13707,76 @@ export class BMWindow extends BMView {
 	static zIndexMax (): number;
 
 
+	/**
+	 * Updates the position of all animated windows based on how many there are.
+	 * @param animated  		Defaults to `YES`. If set to `YES`, this change will be animated.
+	 * 
+	 */
+	private static _updateMinimizedWindowsAnimated (animated?: boolean | null | undefined): void;
+
+
+	/**
+	 * Set to `YES` while monitoring the mouse pointer to autohide the minimized windows strip.
+	 * 
+	 */
+	private static _minimizeAutohideActive (): void;
+
+
+	/**
+	 * Sets up event handlers that automatically hide the minimize strip after the mouse pointer moves away
+	 * from the bottom of the screen for a certain amount of time. For touch devices, this will retain the top part
+	 * of the minimize strip so that it can be invoked by tapping it. For mouse devices, this will completely hide
+	 * the minimize strip.
+	 * 
+	 * Additionally, sets up event handlers to reposition the minimize strip whenever the browser window resized.
+	 * 
+	 */
+	private static _startMinimizeStripAutohide (): void;
+
+
+	/**
+	 * Brings the minimize strip back into view and stops monitoring the mouse pointer to autohide it.
+	 * 
+	 */
+	private static _stopMinimizeStripAutohide (): void;
+
+
+	/**
+	 * Invoked whenever the viewport resizes while the minimize strip is visible. Updates the position
+	 * of the minimize strip and its windows to match the new viewport size.
+	 * @param event 			The event that triggered this action.
+	 * 
+	 */
+	private static _viewportDidResizeWithEvent (event: Event): void;
+
+
+	/**
+	 * Invoked whenever the mouse pointer moves while the minimize strip is visible. Tests if the mouse pointer moves
+	 * sufficiently far away from the strip and hides it if it does, or shows the minimize strip if the mouse pointer
+	 * moves sufficiently close to the bottom of the viewport.
+	 * @param event 		The event that triggered this action.
+	 * 
+	 */
+	private static _mouseDidMoveWithEvent (event: MouseEvent): void;
+
+
+	/**
+	 * Shows the minimize strip if it is hidden.
+	 * @param animated 			Defaults to `YES`. If set to `YES`, this change will be animated.
+	 * @return 						A promise that resolves when the associated animation completes.
+	 * 
+	 */
+	static showMinimizeStripAnimated (animated?: boolean | null | undefined): Promise<void>;
+
+
+	/**
+	 * Hides the minimize strip if it is visible.
+	 * @param animated 			Defaults to `YES`. If set to `YES`, this change will be animated.
+	 * 
+	 */
+	static hideMinimizeStripAnimated (animated?: boolean | null | undefined): void;
+
+
 	/**
 	 * Minimizes all non-minimized windows.
 	 * @param animated 			Defaults to `YES`. If set to `YES`, this change will be animated.
@@ -13870,7 +13940,7 @@ export class BMWindow extends BMView {
 	 * A string that is used for when this window is minimized.
 	 *  
 	 */
-	private _title: string;
+	title: string;
 
 	/**
 	 * The point from which this popover should originate when open or dimissed with an animation.
@@ -13966,6 +14036,35 @@ export class BMWindow extends BMView {
 	performDragWithEvent(event: MouseEvent | TouchEvent): void;
 
 
+	/**
+	 * Invoked whenever a drag operation began for this window.
+	 * @param position 					The position where the drag began, relative to the viewport.
+	 * @param withEvent 	The event that triggered this action.
+	 *  
+	 */
+	protected dragBeganAtPosition(position: BMPoint, {withEvent}: {withEvent: MouseEvent | TouchEvent}): void;
+
+
+	/**
+	 * Invoked whenever the pointer position changes during a drag event. Displaces this window's
+	 * frame by the amount the event pointer has moved.
+	 * @param fromPosition 			The previous pointer position relative to the viewport.
+	 * @param toPosition 				The current pointer position relative to the viewport.
+	 * @param event 	The event that triggered this action.
+	 *  
+	 */
+	protected dragPositionDidChangeFromPosition(fromPosition: BMPoint, {toPosition, event}: {toPosition: BMPoint, event: MouseEvent | TouchEvent}): void;
+
+
+	/**
+	 * Invoked whenever a drag operation ended for this window.
+	 * @param position 					The position where the drag began, relative to the viewport.
+	 * @param withEvent 	The event that triggered this action.
+	 *  
+	 */
+	protected dragEndedAtPosition(position: BMPoint, {withEvent}: {withEvent: MouseEvent | TouchEvent}): void;
+
+
 	/**
 	 * Starts a drag event from the specified `mousedown` event that will move this window.
 	 * When this method is invoked, further mouse events will be blocked until the drag finishes.
@@ -14087,6 +14186,12 @@ export class BMWindow extends BMView {
 	windowDidClose(): void;
 
 
+	/**
+	 * The size that this should be when minimized.
+	 *  
+	 */
+	readonly _minimizedSize: BMSize;
+
 	/**
 	 * Minimizes this window. This method will raise an error if this window is modal.
 	 * If this window is already minimized, this method will have no effect.
@@ -14173,6 +14278,22 @@ export class BMWindow extends BMView {
 }
 
 
+/**
+ * The duration, in milliseconds, for most window animations.
+ * 
+ */
+export var _BMWindowAnimationDurationDefault: any;
+
+
+
+/**
+ * The easing to use for most window animations.
+ * 
+ */
+export var _BMWindowAnimationEasingDefault: any;
+
+
+
 /**
  * Constructs and returns a window that will display in the given rect.
  * @param frame 		The frame.
@@ -14464,6 +14585,105 @@ export interface BMCodeEditorDelegate {
 }
 
 
+/**
+ * A class that describes the display attributes of a popover and supports interpolation.
+ * 
+ */
+export class _BMPopoverDisplayConfiguration implements BMAnimating {
+
+	/**
+	 * The popover's frame, excluding the indicator's size.
+	 *     
+	 */
+	private _frame: BMRect;
+
+	/**
+	 * The indicator's direction relative to the popover's anchor.
+	 *     
+	 */
+	private _direction: BMPopoverIndicatorDirection;
+
+	/**
+	 * The indicator's position along the popover's edge.
+	 *     
+	 */
+	private _indicatorPosition: number;
+
+	/**
+	 * The size of the indicator.
+	 *     
+	 */
+	private _indicatorSize: number;
+
+	/**
+	 * The round radius of the popover's corners.
+	 *     
+	 */
+	private _borderRadius: number;
+
+	/**
+	 * The height of the visible portion of the indicator.
+	 *     
+	 */
+	readonly _indicatorHeight: number;
+
+	/**
+	 * Initializes this popover popover display configuration object with the specified values.
+	 * @param frame                             The popover's frame.
+	 * @param direction   The indicator's direction relative to the popover's anchor.
+	 * @param indicatorPosition                The indicator's position relative to the popover's edge.
+	 * @param indicatorSize                    The size of the indicator.
+	 * @param borderRadius                     The size of the popover's corners.
+	 * @return         This popover display configuration.
+	 *     
+	 */
+	initWithFrame(frame: BMRect, {direction, indicatorPosition, indicatorSize, borderRadius}: {direction: BMPopoverIndicatorDirection, indicatorPosition: number, indicatorSize: number, borderRadius: number}): _BMPopoverDisplayConfiguration;
+
+
+	/**
+	 * Initializes this popover popover display configuration object by copying the values of
+	 * the specified popover display configuration.
+	 * @param config    The configuration whose values to copy.
+	 * @return         This popover display configuration.
+	 *     
+	 */
+	initWithPopoverDisplayConfiguration(config: _BMPopoverDisplayConfiguration): _BMPopoverDisplayConfiguration;
+
+
+	/**
+	 * Creates and returns a copy of this popover display configuration.
+	 * @return         A copy of this object.
+	 *     
+	 */
+	copy(): _BMPopoverDisplayConfiguration;
+
+
+	/**
+	 * Invoked by the CoreUI animation engine to obtain an interpolated
+	 * value between this object and the target object.
+	 * @param fraction                          The animation fraction.
+	 * @param toValue  The object to which to interpolate.
+	 * @return 		    A popover display configuration.
+	 *     
+	 */
+	interpolatedValueWithFraction(fraction: number, {toValue}: {toValue: _BMPopoverDisplayConfiguration}): _BMPopoverDisplayConfiguration;
+
+
+	/**
+	 * Creates and returns a popover display configuration object initialized with the specified values.
+	 * @param frame                             The popover's frame.
+	 * @param direction   The indicator's direction relative to the popover's anchor.
+	 * @param indicatorPosition                The indicator's position relative to the popover's edge.
+	 * @param indicatorSize                    The size of the indicator.
+	 * @param borderRadius                     The size of the popover's corners.
+	 * @return         A popover display configuration.
+	 * 
+	 */
+	static configurationWithFrame (frame: BMRect, {direction, indicatorPosition, indicatorSize, borderRadius}: {direction: BMPopoverIndicatorDirection, indicatorPosition: number, indicatorSize: number, borderRadius: number}): _BMPopoverDisplayConfiguration;
+
+}
+
+
 /**
  * Constants describing the position where the indicator appears on its popover.
  * 
@@ -14507,21 +14727,27 @@ export class BMPopoverIndicatorDirection {
 export class BMPopover extends BMWindow {
 
 	/**
-	 * The point from which this popover should originate, relative to the document. Either this property
+	 * An optional delegate which this popover may notify of key events.
+	 *  
+	 */
+	delegate?: BMPopoverDelegate | null | undefined;
+
+	/**
+	 * Animatable. The point from which this popover should originate, relative to the document. Either this property
 	 * or `anchorNode` or `anchorRect` must be set before this popover is displayed.
 	 *     
 	 */
 	anchorPoint?: BMPoint | null | undefined;
 
 	/**
-	 * The rect from which this popover should originate, relative to the document. Either this property
+	 * Animatable. The rect from which this popover should originate, relative to the document. Either this property
 	 * or `anchorPoint` or `anchorNode` must be set before this popover is displayed.
 	 *     
 	 */
 	anchorRect?: BMRect | null | undefined;
 
 	/**
-	 * The element from which this popover should originate. Either this property
+	 * Animatable. The element from which this popover should originate. Either this property
 	 * or `anchorPoint` or `anchorRect` must be set before this popover is displayed.
 	 *     
 	 */
@@ -14670,7 +14896,80 @@ export class BMPopover extends BMWindow {
 
 
 	/**
-	 * Invoked by CoreUI to update this popover's position and recalculate the various paths used by it.
+	 * Set to `YES` while this popover is detached. When set to `YES` the popover is detached from
+	 * its anchor and can be freely moved. When set to `NO`, the popover remains attached to its
+	 * anchor in a fixed position.
+	 *     
+	 */
+	readonly isDetached: boolean;
+
+	/**
+	 * The current detached position of this popover.
+	 *     
+	 */
+	private _position: BMPoint;
+
+	/**
+	 * The popover's current direction. Set to `undefined` until this popover is first displayed.
+	 *     
+	 */
+	private _direction?: BMPopoverIndicatorDirection | null | undefined;
+
+	/**
+	 * Controls whether this popover retains the direction that was set to it when it was first
+	 * displayed. When set to `NO`, whenever the popover's size or attributes change it will try
+	 * to find a new direction around the anchor. When set to `YES`, the current direction or the
+	 * initial display direction will be kept regardless of how the popover changes.
+	 * 
+	 * When set to `undefined`, this popover will use the behaviour set on the `BMPopover` class.
+	 *     
+	 */
+	retainsDirection?: boolean | null | undefined;
+
+	/**
+	 * The current display configuration. Set to `undefined` until this popover is first displayed.
+	 *     
+	 */
+	private _config?: _BMPopoverDisplayConfiguration | null | undefined;
+
+	/**
+	 * The current display configuration. Set to `undefined` until this popover is first displayed.
+	 *     
+	 */
+	_displayConfiguration?: _BMPopoverDisplayConfiguration | null | undefined;
+
+	/**
+	 * Invoked by CoreUI to create a new display configuration for this popover based on the
+	 * current values of its properties.
+	 * @return          The configuration.
+	 *     
+	 */
+	private _createDisplayConfiguration(): _BMPopoverDisplayConfiguration;
+
+
+	/**
+	 * Invoked by CoreUI to apply the specified display configuration to this popover and its various SVG elements.
+	 * @param config    The configuration to apply.
+	 *     
+	 */
+	private _applyDisplayConfiguration(config: _BMPopoverDisplayConfiguration): void;
+
+
+	/**
+	 * The number of display configuration animations running currently against this popover's display configuration.
+	 *     
+	 */
+	private _displayConfigurationAnimations: number;
+
+	/**
+	 * A display configuration that will be applied to this popover at the end of any current
+	 * animations affecting the display configuration.
+	 *     
+	 */
+	private _pendingDisplayConfiguration: _BMPopoverDisplayConfiguration;
+
+	/**
+	 * Animatable. Invoked by CoreUI to update this popover's position and recalculate the various paths used by it.
 	 *     
 	 */
 	private _updatePosition(): void;
@@ -14718,13 +15017,99 @@ export class BMPopover extends BMWindow {
 
 
 	/**
-	 * Constructs and returns a popover with the given size.
+	 * Controls whether an in-progress drag can detach this popover.
+	 *     
+	 */
+	private _canDetach: boolean;
+
+	/**
+	 * Controls whether this popover is detachable. Defaults to the result provided
+	 * by the delegate.
+	 * @return     `YES` if the popover is detachable, `NO` otherwise.
+	 *     
+	 */
+	protected isDetachable(): boolean;
+
+
+	/**
+	 * During a drag operation set to the point where the drag began.
+	 *     
+	 */
+	private _initialDragPosition?: BMPoint | null | undefined;
+
+	/**
+	 * Detaches this popover from its anchor and allows it to be freely movable.
+	 * @param animated   Defaults to `YES`. When set to `YES`, this change will be animated,
+	 *                                      otherwise it will be instant.
+	 * @return              A promise that resolves when the operation completes.
+	 *     
+	 */
+	detachAnimated(animated?: boolean | null | undefined): Promise<void>;
+
+
+	/**
+	 * Constructs and returns a popover with the specified size.
 	 * @param size          The popover's size.
 	 * @return           A popover.
 	 * 
 	 */
 	static popoverWithSize (size: BMSize): BMPopover;
 
+
+	/**
+	 * Controls whether popovers retain the direction that was set to them when they were first
+	 * displayed, by default. When set to `NO`, whenever a popover's size or attributes change it will try
+	 * to find a new direction around the anchor. When set to `YES`, the current direction or the
+	 * initial display direction will be kept regardless of how the popover changes.
+	 * 
+	 */
+	private static _retainsDirection (): void;
+
+
+	/**
+	 * Controls whether popovers retain the direction that was set to them when they were first
+	 * displayed, by default. When set to `NO`, whenever a popover's size or attributes change it will try
+	 * to find a new direction around the anchor. When set to `YES`, the current direction or the
+	 * initial display direction will be kept regardless of how the popover changes.
+	 * @param retains        Defaults to `NO`. When set to `YES`, popovers will retain their
+	 *                                          initial direction, otherwise they will recalculate their direction
+	 *                                          whenever any update occurs.
+	 * 
+	 */
+	static setRetainsDirection (retains?: boolean | null | undefined): void;
+
+}
+
+
+/**
+ * The specification for a `BMPopoverDelegate` object, which can optionally be used in conjunction with
+ * `BMPopover` objects and will receive various callbacks related to the popover's lifecycle.
+ * 
+ */
+export interface BMPopoverDelegate extends BMWindowDelegate {
+
+	/**
+	 * Invoked when a drag interaction starts to verify if the operation can cause the popover
+	 * to detach from its anchor and become freely movable.
+	 * 
+	 * Delegate objects can optionally implement this method and return `YES` to cause the popover
+	 * to detach from the anchor and be freely movable.
+	 * 
+	 * When this method is not implemented, popovers cannot be detached from their anchor.
+	 * @param popover 		The calling popover.
+	 * @return                `YES` if the popover should detach, `NO` otherwise.
+	 *  
+	 */
+	popoverCanDetach?(popover: BMPopover): boolean;
+
+
+	/**
+	 * Invoked when a popover has detached from its anchor and any associated animation has finished playing.
+	 * @param popover 		The calling popover.
+	 *  
+	 */
+	popoverDidDetach?(popover: BMPopover): void;
+
 }
 
 

package/build/BMCoreUI.css

@@ -232,31 +232,107 @@
 	-webkit-tap-highlight-color: transparent;
 }
 
+.BMWindowMinimizedPreview {
+	z-index: 2008 !important;
+}
+
 .BMWindowMinimized {
-	position: absolute;
+	position: fixed;
 	left: 0px;
 	bottom: 2px;
 
-	width: 256px;
-	height: 32px;
+	width: 160px;
+	height: 160px;
 
-	background-color: white;
-	color: rgba(0, 0, 0, .8);
-	font-weight: 500;
+	color: white;
+	font-weight: 600;
 	line-height: 32px;
-	vertical-align: middle;
 
 	box-sizing: border-box !important; /* Important needed for Thingworx new composer */
 
-	padding-left: 8px;
-
-	transition: left .3s ease;
-
 	z-index: 2008;
 
 	border-radius: 4px;
-	box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, .1), 0px 3px 8px rgba(0, 0, 0, .1);
+	text-shadow: 0px 0px 1px rgba(0, 0, 0, .5), 0px 3px 8px rgba(0, 0, 0, .33), 0px 8px 20px black, 0px 12px 30px black;
 	cursor: default;
+
+    display: flex;
+    align-items: end;
+    justify-content: center;
+}
+
+.BMWindowMinimized > span {
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+
+	line-height: 1;
+
+	padding: 6px 10px;
+	background-color: rgba(0, 0, 0, .25);
+	border-radius: 6px;
+
+	backdrop-filter: blur(15px);
+	-webkit-backdrop-filter: blur(15px);
+
+	margin-bottom: 2px;
+}
+
+@keyframes BMWindowMinimizeStripHide {
+	0% {
+		transform: translateY(0px);
+	}
+
+	100% {
+		transform: translateY(180px);
+	}
+}
+
+@keyframes BMWindowMinimizeStripHideOpacity {
+	0% {
+		opacity: 1;
+	}
+
+	100% {
+		opacity: 0;
+	}
+}
+
+@keyframes BMWindowMinimizeStripShow {
+	0% {
+		transform: translateY(180px);
+	}
+
+	100% {
+		transform: translateY(0px);
+	}
+}
+
+@keyframes BMWindowMinimizeStripShowOpacity {
+	0% {
+		opacity: 0;
+	}
+
+	100% {
+		opacity: 1;
+	}
+}
+
+.BMWindowMinimizeStripHidden > .BMWindowMinimizedThumbnail,
+.BMWindowMinimizeStripHidden > .BMWindowMinimizedControl {
+	animation-name: BMWindowMinimizeStripHide, BMWindowMinimizeStripHideOpacity;
+	animation-duration: 200ms, 200ms;
+	animation-timing-function: ease-in, ease-in;
+	animation-fill-mode: forwards, forwards;
+	animation-composition: accumulate, replace;
+}
+
+.BMWindowMinimizeStripShown > .BMWindowMinimizedThumbnail,
+.BMWindowMinimizeStripShown > .BMWindowMinimizedControl {
+	animation-name: BMWindowMinimizeStripShow, BMWindowMinimizeStripShowOpacity;
+	animation-duration: 200ms, 200ms;
+	animation-timing-function: ease-out, ease-out;
+	animation-composition: accumulate, replace;
 }
 
 @media (prefers-color-scheme: dark) {