@qrvey/utils 1.15.0-13 → 1.15.0-14

package/dist/cjs/elements/helpers/fixed.d.ts

@@ -40,6 +40,14 @@ export declare const getFixedPositionByDevice: (item: VemFixed, device: CanvasDe
  * @returns
  */
 export declare function findFixedAvailablePositions(canvasWidth: number, newElements: VemFixed[], elements: VemFixed[], device: CanvasDevice, startWithPositionY?: boolean, findRightToLeft?: boolean, canvasHeight?: number): VemFixed[];
+/**
+ * Adjusts the `width` of a responsive element to fit within the specified canvas width and updates its position.
+ * @param element - The fixed element to adjust.
+ * @param canvasWidth - The width of the canvas in grid columns.
+ * @param canvasDevice - The target device type (e.g., desktop, tablet, mobile).
+ * @returns - The updated responsive element with an adjusted `width`.
+ */
+export declare function calculateWidth(element: VemFixed, canvasWidth: number, canvasDevice: CanvasDevice): VemFixed;
 /**
  * @param elements elements to calculate
  * @param device  current device

package/dist/cjs/elements/helpers/fixed.js

@@ -1,7 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getFixedGridElementsBottomLimit = exports.findFixedAvailablePositions = exports.getFixedPositionByDevice = exports.findAvailablePosition = exports.updateFixedPosition = void 0;
+exports.getFixedGridElementsBottomLimit = exports.calculateWidth = exports.findFixedAvailablePositions = exports.getFixedPositionByDevice = exports.findAvailablePosition = exports.updateFixedPosition = void 0;
+const IVemPosition_1 = require("../interfaces/IVemPosition");
 const overlap_1 = require("../utils/overlap");
+const position_1 = require("../utils/position");
 const SPACE_DELTA = 10;
 /**
  * update the position for a specific device
@@ -96,14 +98,29 @@ function findFixedAvailablePositions(canvasWidth, newElements, elements, device,
         const initialY = startWithPositionY
             ? nElement.position.fixed[device].y
             : 0;
-        const availablePosition = findAvailablePosition(canvasWidth, nElement, processedElements, device, { initialY, findRightToLeft, canvasHeight });
-        const newElemWithPosition = updateFixedPosition(nElement, availablePosition, device);
+        const newElement = calculateWidth(nElement, canvasWidth, device);
+        const availablePosition = findAvailablePosition(canvasWidth, newElement, processedElements, device, { initialY, findRightToLeft, canvasHeight });
+        const newElemWithPosition = updateFixedPosition(newElement, availablePosition, device);
         resultElems.push(newElemWithPosition);
         processedElements.push(newElemWithPosition);
     });
     return resultElems;
 }
 exports.findFixedAvailablePositions = findFixedAvailablePositions;
+/**
+ * Adjusts the `width` of a responsive element to fit within the specified canvas width and updates its position.
+ * @param element - The fixed element to adjust.
+ * @param canvasWidth - The width of the canvas in grid columns.
+ * @param canvasDevice - The target device type (e.g., desktop, tablet, mobile).
+ * @returns - The updated responsive element with an adjusted `width`.
+ */
+function calculateWidth(element, canvasWidth, canvasDevice) {
+    const currentPosition = element.position.fixed[canvasDevice];
+    const fixedWidth = Math.min(currentPosition.width, canvasWidth);
+    const position = Object.assign(Object.assign({}, currentPosition), { width: fixedWidth });
+    return (0, position_1.setElementPosition)(element, IVemPosition_1.VemPositionType.FIXED, canvasDevice, position);
+}
+exports.calculateWidth = calculateWidth;
 const getFixedGridElementY = (element, device, allowNegative = false) => {
     var _a;
     const position = element.position.fixed[device];

package/dist/elements/helpers/fixed.d.ts

@@ -40,6 +40,14 @@ export declare const getFixedPositionByDevice: (item: VemFixed, device: CanvasDe
  * @returns
  */
 export declare function findFixedAvailablePositions(canvasWidth: number, newElements: VemFixed[], elements: VemFixed[], device: CanvasDevice, startWithPositionY?: boolean, findRightToLeft?: boolean, canvasHeight?: number): VemFixed[];
+/**
+ * Adjusts the `width` of a responsive element to fit within the specified canvas width and updates its position.
+ * @param element - The fixed element to adjust.
+ * @param canvasWidth - The width of the canvas in grid columns.
+ * @param canvasDevice - The target device type (e.g., desktop, tablet, mobile).
+ * @returns - The updated responsive element with an adjusted `width`.
+ */
+export declare function calculateWidth(element: VemFixed, canvasWidth: number, canvasDevice: CanvasDevice): VemFixed;
 /**
  * @param elements elements to calculate
  * @param device  current device

package/dist/elements/helpers/fixed.js

@@ -1,4 +1,6 @@
+import { VemPositionType } from "../interfaces/IVemPosition";
 import { OverlapIntervalTree } from "../utils/overlap";
+import { setElementPosition } from "../utils/position";
 const SPACE_DELTA = 10;
 /**
  * update the position for a specific device
@@ -90,13 +92,27 @@ export function findFixedAvailablePositions(canvasWidth, newElements, elements,
         const initialY = startWithPositionY
             ? nElement.position.fixed[device].y
             : 0;
-        const availablePosition = findAvailablePosition(canvasWidth, nElement, processedElements, device, { initialY, findRightToLeft, canvasHeight });
-        const newElemWithPosition = updateFixedPosition(nElement, availablePosition, device);
+        const newElement = calculateWidth(nElement, canvasWidth, device);
+        const availablePosition = findAvailablePosition(canvasWidth, newElement, processedElements, device, { initialY, findRightToLeft, canvasHeight });
+        const newElemWithPosition = updateFixedPosition(newElement, availablePosition, device);
         resultElems.push(newElemWithPosition);
         processedElements.push(newElemWithPosition);
     });
     return resultElems;
 }
+/**
+ * Adjusts the `width` of a responsive element to fit within the specified canvas width and updates its position.
+ * @param element - The fixed element to adjust.
+ * @param canvasWidth - The width of the canvas in grid columns.
+ * @param canvasDevice - The target device type (e.g., desktop, tablet, mobile).
+ * @returns - The updated responsive element with an adjusted `width`.
+ */
+export function calculateWidth(element, canvasWidth, canvasDevice) {
+    const currentPosition = element.position.fixed[canvasDevice];
+    const fixedWidth = Math.min(currentPosition.width, canvasWidth);
+    const position = Object.assign(Object.assign({}, currentPosition), { width: fixedWidth });
+    return setElementPosition(element, VemPositionType.FIXED, canvasDevice, position);
+}
 const getFixedGridElementY = (element, device, allowNegative = false) => {
     var _a;
     const position = element.position.fixed[device];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qrvey/utils",
-  "version": "1.15.0-13",
+  "version": "1.15.0-14",
   "description": "Helper, Utils for all Qrvey Projects",
   "homepage": "https://bitbucket.org/qrvey/qrvey_utils/wiki/Home",
   "main": "dist/index.js",