@fluid-topics/ft-wc-utils 1.3.63 → 1.4.1

package/build/FtSlotHelper.d.ts

@@ -0,0 +1 @@
+export declare const isSlotEmptyOrWithoutContent: (slot: HTMLSlotElement | undefined) => boolean;

package/build/FtSlotHelper.js

@@ -0,0 +1,14 @@
+export const isSlotEmptyOrWithoutContent = (slot) => {
+    if (!slot) {
+        return true;
+    }
+    const nodes = slot.assignedNodes({ flatten: true });
+    const meaningful = nodes.filter((node) => {
+        var _a;
+        if (node.nodeType === Node.TEXT_NODE) {
+            return ((_a = node.textContent) !== null && _a !== void 0 ? _a : "").trim().length > 0;
+        }
+        return true;
+    });
+    return meaningful.length === 0;
+};

package/build/floating.d.ts

@@ -5,5 +5,14 @@ type PositionOptions = {
     strategy?: Strategy;
 };
 export declare function computeOffsetPosition(reference: HTMLElement, element: HTMLElement, placementOrOptions: Placement | PositionOptions): Promise<ComputePositionReturn>;
+type AutoPositionOptions = {
+    placement?: Placement;
+    allowedPlacements?: Placement[];
+    strategy?: Strategy;
+    maxHeightCssVariable?: string | FtCssVariable;
+    maxWidthCssVariable?: string | FtCssVariable;
+    offsetValue?: number;
+};
 export declare function computeOffsetAutoPosition(reference: HTMLElement, element: HTMLElement, placement?: Placement, allowedPlacements?: Placement[], strategy?: Strategy, maxHeightCssVariable?: string | FtCssVariable, offsetValue?: number): Promise<ComputePositionReturn>;
+export declare function computeOffsetAutoPosition(reference: HTMLElement, element: HTMLElement, options?: AutoPositionOptions): Promise<ComputePositionReturn>;
 export {};

package/build/floating.js

@@ -22,7 +22,20 @@ export async function computeOffsetPosition(reference, element, placementOrOptio
         ],
     });
 }
-export async function computeOffsetAutoPosition(reference, element, placement, allowedPlacements, strategy, maxHeightCssVariable, offsetValue = 4) {
+export async function computeOffsetAutoPosition(reference, element, placementOrOptions, allowedPlacements, strategy, maxHeightCssVariable, offsetValue) {
+    let placement;
+    let maxWidthCssVariable;
+    if (typeof placementOrOptions === "object") {
+        placement = placementOrOptions.placement;
+        allowedPlacements = placementOrOptions.allowedPlacements;
+        strategy = placementOrOptions.strategy;
+        maxHeightCssVariable = placementOrOptions.maxHeightCssVariable;
+        maxWidthCssVariable = placementOrOptions.maxWidthCssVariable;
+        offsetValue = placementOrOptions.offsetValue;
+    }
+    else {
+        placement = placementOrOptions;
+    }
     return computePosition(reference, element, {
         placement: placement,
         strategy: strategy,
@@ -33,10 +46,10 @@ export async function computeOffsetAutoPosition(reference, element, placement, a
             },
         },
         middleware: [
-            offset(offsetValue),
+            offset(offsetValue !== null && offsetValue !== void 0 ? offsetValue : 4),
             autoPlacement({ allowedPlacements: allowedPlacements }),
             size({
-                apply({ availableHeight, elements }) {
+                apply({ availableHeight, availableWidth, elements }) {
                     if (typeof maxHeightCssVariable === "string") {
                         maxHeightCssVariable = `var(${maxHeightCssVariable})`;
                     }
@@ -46,8 +59,17 @@ export async function computeOffsetAutoPosition(reference, element, placement, a
                     else {
                         elements.floating.style.maxHeight = `${Math.max(0, availableHeight)}px`;
                     }
+                    if (typeof maxWidthCssVariable === "string") {
+                        maxWidthCssVariable = `var(${maxWidthCssVariable})`;
+                    }
+                    if (maxWidthCssVariable) {
+                        elements.floating.style.maxWidth = `min(${Math.max(0, availableWidth)}px, ${maxWidthCssVariable})`;
+                    }
+                    else {
+                        elements.floating.style.maxWidth = `${Math.max(0, availableWidth)}px`;
+                    }
                 },
             }),
-        ]
+        ],
     });
 }