@navikt/ds-react 6.7.0 → 6.7.1

package/esm/overlay/dismiss/util/useFocusOutside.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFocusOutside.js","sourceRoot":"","sources":["../../../../src/overlay/dismiss/util/useFocusOutside.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EACL,aAAa,EAEb,mBAAmB,GACpB,MAAM,uBAAuB,CAAC;AAE/B;;GAEG;AACH,MAAM,UAAU,eAAe,CAC7B,QAA4C,EAC5C,gBAA0B,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,QAAQ;IAE9C,MAAM,kBAAkB,GAAG,cAAc,CAAC,QAAQ,CAAkB,CAAC;IACrE,MAAM,yBAAyB,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAEhD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,WAAW,GAAG,CAAC,KAAiB,EAAE,EAAE;YACxC,IAAI,KAAK,CAAC,MAAM,IAAI,CAAC,yBAAyB,CAAC,OAAO,EAAE,CAAC;gBACvD,MAAM,WAAW,GAAG,EAAE,aAAa,EAAE,KAAK,EAAE,CAAC;gBAE7C;;;;;;;;mBAQG;gBACH,mBAAmB,CACjB,aAAa,CAAC,aAAa,EAC3B,kBAAkB,EAClB,WAAW,CACZ,CAAC;YACJ,CAAC;QACH,CAAC,CAAC;QACF,aAAa,CAAC,gBAAgB,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;QACvD,OAAO,GAAG,EAAE,CAAC,aAAa,CAAC,mBAAmB,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;IACzE,CAAC,EAAE,CAAC,aAAa,EAAE,kBAAkB,CAAC,CAAC,CAAC;IAExC;;;OAGG;IACH,OAAO;QACL,cAAc,EAAE,GAAG,EAAE,CAAC,CAAC,yBAAyB,CAAC,OAAO,GAAG,IAAI,CAAC;QAChE,aAAa,EAAE,GAAG,EAAE,CAAC,CAAC,yBAAyB,CAAC,OAAO,GAAG,KAAK,CAAC;KACjE,CAAC;AACJ,CAAC"}

package/esm/overlay/dismiss/util/usePointerDownOutside.d.ts

@@ -0,0 +1,10 @@
+import { CustomPointerDownEvent } from "./dispatchCustomEvent.js";
+/**
+ * Listens for `pointerdown` outside a react subtree. We use `pointerdown` rather than `pointerup`
+ * to mimic layer dismissing behaviour present in OS.
+ * Returns props to pass to the node we want to check for outside events.
+ * By checking `isPointerInsideReactTreeRef` we can determine if the event happened outside the subtree of the node, saving some element-comparisons.
+ */
+export declare function usePointerDownOutside(callback?: (event: CustomPointerDownEvent) => void, ownerDocument?: Document): {
+    onPointerDownCapture: () => boolean;
+};

package/esm/overlay/dismiss/util/usePointerDownOutside.js

@@ -0,0 +1,80 @@
+import { useEffect, useRef } from "react";
+import { useCallbackRef } from "../../../util/hooks/index.js";
+import { CUSTOM_EVENTS, dispatchCustomEvent, } from "./dispatchCustomEvent.js";
+/**
+ * Listens for `pointerdown` outside a react subtree. We use `pointerdown` rather than `pointerup`
+ * to mimic layer dismissing behaviour present in OS.
+ * Returns props to pass to the node we want to check for outside events.
+ * By checking `isPointerInsideReactTreeRef` we can determine if the event happened outside the subtree of the node, saving some element-comparisons.
+ */
+export function usePointerDownOutside(callback, ownerDocument = globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) {
+    const handlePointerDownOutside = useCallbackRef(callback);
+    const isPointerInsideReactTreeRef = useRef(false);
+    const handleClickRef = useRef(() => { });
+    useEffect(() => {
+        const handlePointerDown = (event) => {
+            /**
+             * The `DismisableLayer`-API is based on the ability to stop events from propagating and in the end calling `onDismiss`
+             * if `usePointerDownOutside` runs `event.preventDefault()`.
+             *
+             * Altrough `pointerdown` is already a cancelable event,
+             * to to make sure the batching of events works corretly with `focusIn` in `useFocusOutside`,
+             * we still use a custom event like in `useFocusOutside`.
+             *
+             * Since pointer-events are `discrete` events in React: https://github.com/facebook/react/blob/a8a4742f1c54493df00da648a3f9d26e3db9c8b5/packages/react-dom/src/events/ReactDOMEventListener.js#L318
+             * we need to to use flushSync to ensure that the event is dispatched before the next event is raised.
+             */
+            function dispatchPointerEvent() {
+                dispatchCustomEvent(CUSTOM_EVENTS.POINTER_DOWN_OUTSIDE, handlePointerDownOutside, { originalEvent: event }, { discrete: true });
+            }
+            if (event.target && !isPointerInsideReactTreeRef.current) {
+                /**
+                 * On touch devices, we delay reactivating pointer-events to account for the browser's delay in executing events after touch ends.
+                 * This also handles cancellations when no click event is raised due to scrolling or long-pressing.
+                 * We continuously remove the previous listener as we can't be sure it was raised and cleaned up.
+                 */
+                if (event.pointerType === "touch") {
+                    ownerDocument.removeEventListener("click", handleClickRef.current);
+                    handleClickRef.current = dispatchPointerEvent;
+                    ownerDocument.addEventListener("click", handleClickRef.current, {
+                        once: true,
+                    });
+                }
+                else {
+                    dispatchPointerEvent();
+                }
+            }
+            else {
+                // We need to remove the event listener in case the outside click has been canceled.
+                ownerDocument.removeEventListener("click", handleClickRef.current);
+            }
+            isPointerInsideReactTreeRef.current = false;
+        };
+        /**
+         * If this hook executes in a component that mounts via a `pointerdown` event, the event
+         * would bubble up to the document and trigger a `pointerDownOutside` event. We avoid
+         * this by delaying the event listener registration on the document.
+         * This is not React specific, but rather how the DOM works, ie:
+         * ```
+         * button.addEventListener('pointerdown', () => {
+         *   console.log('I will log');
+         *   document.addEventListener('pointerdown', () => {
+         *     console.log('I will also log');
+         *   })
+         * });
+         */
+        const timerId = window.setTimeout(() => {
+            ownerDocument.addEventListener("pointerdown", handlePointerDown);
+        }, 0);
+        return () => {
+            window.clearTimeout(timerId);
+            ownerDocument.removeEventListener("pointerdown", handlePointerDown);
+            ownerDocument.removeEventListener("click", handleClickRef.current);
+        };
+    }, [ownerDocument, handlePointerDownOutside]);
+    return {
+        // ensures we check React component tree (not just DOM tree)
+        onPointerDownCapture: () => (isPointerInsideReactTreeRef.current = true),
+    };
+}
+//# sourceMappingURL=usePointerDownOutside.js.map

package/esm/overlay/dismiss/util/usePointerDownOutside.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePointerDownOutside.js","sourceRoot":"","sources":["../../../../src/overlay/dismiss/util/usePointerDownOutside.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EACL,aAAa,EAEb,mBAAmB,GACpB,MAAM,uBAAuB,CAAC;AAE/B;;;;;GAKG;AACH,MAAM,UAAU,qBAAqB,CACnC,QAAkD,EAClD,gBAA0B,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,QAAQ;IAE9C,MAAM,wBAAwB,GAAG,cAAc,CAAC,QAAQ,CAAkB,CAAC;IAC3E,MAAM,2BAA2B,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,cAAc,GAAG,MAAM,CAAkC,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC;IAEzE,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,iBAAiB,GAAG,CAAC,KAAmB,EAAE,EAAE;YAChD;;;;;;;;;;eAUG;YACH,SAAS,oBAAoB;gBAC3B,mBAAmB,CACjB,aAAa,CAAC,oBAAoB,EAClC,wBAAwB,EACxB,EAAE,aAAa,EAAE,KAAK,EAAE,EACxB,EAAE,QAAQ,EAAE,IAAI,EAAE,CACnB,CAAC;YACJ,CAAC;YAED,IAAI,KAAK,CAAC,MAAM,IAAI,CAAC,2BAA2B,CAAC,OAAO,EAAE,CAAC;gBACzD;;;;mBAIG;gBACH,IAAI,KAAK,CAAC,WAAW,KAAK,OAAO,EAAE,CAAC;oBAClC,aAAa,CAAC,mBAAmB,CAAC,OAAO,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;oBACnE,cAAc,CAAC,OAAO,GAAG,oBAAoB,CAAC;oBAC9C,aAAa,CAAC,gBAAgB,CAAC,OAAO,EAAE,cAAc,CAAC,OAAO,EAAE;wBAC9D,IAAI,EAAE,IAAI;qBACX,CAAC,CAAC;gBACL,CAAC;qBAAM,CAAC;oBACN,oBAAoB,EAAE,CAAC;gBACzB,CAAC;YACH,CAAC;iBAAM,CAAC;gBACN,oFAAoF;gBACpF,aAAa,CAAC,mBAAmB,CAAC,OAAO,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;YACrE,CAAC;YACD,2BAA2B,CAAC,OAAO,GAAG,KAAK,CAAC;QAC9C,CAAC,CAAC;QAEF;;;;;;;;;;;;WAYG;QACH,MAAM,OAAO,GAAG,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE;YACrC,aAAa,CAAC,gBAAgB,CAAC,aAAa,EAAE,iBAAiB,CAAC,CAAC;QACnE,CAAC,EAAE,CAAC,CAAC,CAAC;QAEN,OAAO,GAAG,EAAE;YACV,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;YAC7B,aAAa,CAAC,mBAAmB,CAAC,aAAa,EAAE,iBAAiB,CAAC,CAAC;YACpE,aAAa,CAAC,mBAAmB,CAAC,OAAO,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;QACrE,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,aAAa,EAAE,wBAAwB,CAAC,CAAC,CAAC;IAE9C,OAAO;QACL,4DAA4D;QAC5D,oBAAoB,EAAE,GAAG,EAAE,CAAC,CAAC,2BAA2B,CAAC,OAAO,GAAG,IAAI,CAAC;KACzE,CAAC;AACJ,CAAC"}

package/esm/overlays/floating/Floating.d.ts

@@ -0,0 +1,53 @@
+import React, { HTMLAttributes } from "react";
+import { AsChildProps } from "../../util/types/index.js";
+import { type Align, type Measurable, type Side } from "./Floating.utils.js";
+/**
+ * Floating Root
+ */
+type FloatingContextValue = {
+    anchor: Measurable | null;
+    onAnchorChange: (anchor: Measurable | null) => void;
+};
+export declare const FloatingProvider: React.ForwardRefExoticComponent<FloatingContextValue & {
+    children: React.ReactNode;
+} & React.RefAttributes<unknown>>, useFloatingContext: <S extends boolean = true>(strict?: S) => S extends true ? FloatingContextValue : FloatingContextValue | undefined;
+interface FloatingProps {
+    children: React.ReactNode;
+}
+interface FloatingComponent extends React.FC<FloatingProps> {
+    Anchor: typeof FloatingAnchor;
+    Content: typeof FloatingContent;
+}
+declare const Floating: FloatingComponent;
+/**
+ * Floating Anchor
+ */
+type FloatingAnchorProps = HTMLAttributes<HTMLDivElement> & AsChildProps & {
+    virtualRef?: React.RefObject<Measurable>;
+};
+/**
+ * `FloatingAnchor` provides an anchor for a Floating instance.
+ * Allows anchoring to non-DOM nodes like a cursor position when used with `virtualRef`.
+ */
+declare const FloatingAnchor: React.ForwardRefExoticComponent<FloatingAnchorProps & React.RefAttributes<HTMLDivElement>>;
+type Boundary = Element | null;
+interface FloatingContentProps extends HTMLAttributes<HTMLDivElement> {
+    side?: Side;
+    sideOffset?: number;
+    align?: Align;
+    alignOffset?: number;
+    avoidCollisions?: boolean;
+    collisionBoundary?: Boundary | Boundary[];
+    collisionPadding?: number | Partial<Record<Side, number>>;
+    hideWhenDetached?: boolean;
+    updatePositionStrategy?: "optimized" | "always";
+    onPlaced?: () => void;
+    arrow?: {
+        className?: string;
+        padding?: number;
+        width: number;
+        height: number;
+    };
+}
+declare const FloatingContent: React.ForwardRefExoticComponent<FloatingContentProps & React.RefAttributes<HTMLDivElement>>;
+export { Floating };

package/esm/overlays/floating/Floating.js

@@ -0,0 +1,188 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { autoUpdate, flip, arrow as floatingArrow, hide, limitShift, offset, shift, size, useFloating, } from "@floating-ui/react-dom";
+import React, { forwardRef, useEffect, useRef, useState, } from "react";
+import { Slot } from "../../util/Slot.js";
+import { createContext } from "../../util/create-context.js";
+import { useCallbackRef, useClientLayoutEffect, useMergeRefs, } from "../../util/hooks/index.js";
+import { getSideAndAlignFromPlacement, transformOrigin, } from "./Floating.utils.js";
+export const [FloatingProvider, useFloatingContext] = createContext({
+    name: "FloatingContext",
+    hookName: "useFloating",
+    providerName: "FloatingProvider",
+});
+const Floating = ({ children }) => {
+    const [anchor, setAnchor] = useState(null);
+    return (React.createElement(FloatingProvider, { anchor: anchor, onAnchorChange: setAnchor }, children));
+};
+/**
+ * `FloatingAnchor` provides an anchor for a Floating instance.
+ * Allows anchoring to non-DOM nodes like a cursor position when used with `virtualRef`.
+ */
+const FloatingAnchor = forwardRef((_a, forwardedRef) => {
+    var { virtualRef, asChild } = _a, rest = __rest(_a, ["virtualRef", "asChild"]);
+    const context = useFloatingContext();
+    const ref = useRef(null);
+    const mergedRef = useMergeRefs(forwardedRef, ref);
+    useEffect(() => {
+        // Allows anchoring the floating to non-DOM nodes like a cursor position.
+        // We replace `anchorRef` with a virtual ref in such cases.
+        context.onAnchorChange((virtualRef === null || virtualRef === void 0 ? void 0 : virtualRef.current) || ref.current);
+    });
+    const Comp = asChild ? Slot : "div";
+    return virtualRef ? null : React.createElement(Comp, Object.assign({ ref: mergedRef }, rest));
+});
+/**
+ * Floating Arrow
+ */
+const OPPOSITE_SIDE = {
+    top: "bottom",
+    right: "left",
+    bottom: "top",
+    left: "right",
+};
+const FloatingArrow = ({ width, height, className }) => {
+    const context = useFloatingContentContext();
+    const side = OPPOSITE_SIDE[context.placedSide];
+    return (React.createElement("span", { ref: context.onArrowChange, style: {
+            position: "absolute",
+            left: context.arrowX,
+            top: context.arrowY,
+            [side]: 0,
+            transformOrigin: {
+                top: "",
+                right: "0 0",
+                bottom: "center 0",
+                left: "100% 0",
+            }[context.placedSide],
+            transform: {
+                top: "translateY(100%)",
+                right: "translateY(50%) rotate(90deg) translateX(-50%)",
+                bottom: `rotate(180deg)`,
+                left: "translateY(50%) rotate(-90deg) translateX(50%)",
+            }[context.placedSide],
+            visibility: context.hideArrow ? "hidden" : undefined,
+        }, "aria-hidden": true },
+        React.createElement("svg", { className: className, width: width, height: height, viewBox: "0 0 30 10", preserveAspectRatio: "none", style: { display: "block" } },
+            React.createElement("polygon", { points: "0,0 30,0 15,10" }))));
+};
+const [FloatingContentProvider, useFloatingContentContext] = createContext({
+    name: "FloatingContentContext",
+    hookName: "useFloatingContentContext",
+    providerName: "FloatingContentProvider",
+});
+const FloatingContent = forwardRef((_a, forwardedRef) => {
+    var _b, _c, _d, _e, _f, _g;
+    var { children, side = "bottom", sideOffset = 0, align = "center", alignOffset = 0, avoidCollisions = true, collisionBoundary = [], collisionPadding: collisionPaddingProp = 0, hideWhenDetached = false, updatePositionStrategy = "optimized", onPlaced, arrow: _arrow } = _a, contentProps = __rest(_a, ["children", "side", "sideOffset", "align", "alignOffset", "avoidCollisions", "collisionBoundary", "collisionPadding", "hideWhenDetached", "updatePositionStrategy", "onPlaced", "arrow"]);
+    const context = useFloatingContext();
+    const [content, setContent] = useState(null);
+    const mergeRefs = useMergeRefs(forwardedRef, setContent);
+    const arrowDefaults = Object.assign({ padding: 5, width: 0, height: 0 }, _arrow);
+    const [arrow, setArrow] = useState(null);
+    const arrowWidth = arrowDefaults.width;
+    const arrowHeight = arrowDefaults.height;
+    const desiredPlacement = (side +
+        (align !== "center" ? "-" + align : ""));
+    const collisionPadding = typeof collisionPaddingProp === "number"
+        ? collisionPaddingProp
+        : Object.assign({ top: 0, right: 0, bottom: 0, left: 0 }, collisionPaddingProp);
+    const boundary = Array.isArray(collisionBoundary)
+        ? collisionBoundary
+        : [collisionBoundary];
+    const hasExplicitBoundaries = boundary.length > 0;
+    /**
+     * .filter(x => x !== null) does not narrow the type of the array enough.
+     */
+    function isNotNull(value) {
+        return value !== null;
+    }
+    const detectOverflowOptions = {
+        padding: collisionPadding,
+        boundary: boundary.filter(isNotNull),
+        // with `strategy: 'fixed'`, this is the only way to get it to respect boundaries
+        altBoundary: hasExplicitBoundaries,
+    };
+    const { refs, floatingStyles, placement, isPositioned, middlewareData } = useFloating({
+        // default to `fixed` strategy so users don't have to pick and we also avoid focus scroll issues
+        strategy: "fixed",
+        placement: desiredPlacement,
+        whileElementsMounted: (...args) => {
+            const cleanup = autoUpdate(...args, {
+                animationFrame: updatePositionStrategy === "always",
+            });
+            return cleanup;
+        },
+        elements: {
+            reference: context.anchor,
+        },
+        middleware: [
+            offset({
+                mainAxis: sideOffset + arrowHeight,
+                alignmentAxis: alignOffset,
+            }),
+            avoidCollisions &&
+                shift(Object.assign({ mainAxis: true, crossAxis: false, limiter: limitShift() }, detectOverflowOptions)),
+            avoidCollisions && flip(Object.assign({}, detectOverflowOptions)),
+            size(Object.assign(Object.assign({}, detectOverflowOptions), { apply: ({ elements, rects, availableWidth, availableHeight }) => {
+                    const { width: anchorWidth, height: anchorHeight } = rects.reference;
+                    const contentStyle = elements.floating.style;
+                    /**
+                     * Allows styling and animations based on the available space.
+                     */
+                    contentStyle.setProperty("--ac-floating-available-width", `${availableWidth}px`);
+                    contentStyle.setProperty("--ac-floating-available-height", `${availableHeight}px`);
+                    contentStyle.setProperty("--ac-floating-anchor-width", `${anchorWidth}px`);
+                    contentStyle.setProperty("--ac-floating-anchor-height", `${anchorHeight}px`);
+                } })),
+            arrow &&
+                floatingArrow({ element: arrow, padding: arrowDefaults.padding }),
+            transformOrigin({ arrowWidth, arrowHeight }),
+            hideWhenDetached &&
+                hide(Object.assign({ strategy: "referenceHidden" }, detectOverflowOptions)),
+        ],
+    });
+    const [placedSide, placedAlign] = getSideAndAlignFromPlacement(placement);
+    const handlePlaced = useCallbackRef(onPlaced);
+    useClientLayoutEffect(() => {
+        isPositioned && (handlePlaced === null || handlePlaced === void 0 ? void 0 : handlePlaced());
+    }, [isPositioned, handlePlaced]);
+    const arrowX = (_b = middlewareData.arrow) === null || _b === void 0 ? void 0 : _b.x;
+    const arrowY = (_c = middlewareData.arrow) === null || _c === void 0 ? void 0 : _c.y;
+    const cannotCenterArrow = ((_d = middlewareData.arrow) === null || _d === void 0 ? void 0 : _d.centerOffset) !== 0;
+    const [contentZIndex, setContentZIndex] = useState();
+    useClientLayoutEffect(() => {
+        if (content)
+            setContentZIndex(window.getComputedStyle(content).zIndex);
+    }, [content]);
+    return (React.createElement("div", { ref: refs.setFloating, "data-aksel-floating-content-wrapper": "", style: Object.assign(Object.assign({}, floatingStyles), { transform: isPositioned
+                ? floatingStyles.transform
+                : "translate(0, -200%)", minWidth: "max-content", zIndex: contentZIndex, ["--ac-floating-transform-origin"]: [
+                (_e = middlewareData.transformOrigin) === null || _e === void 0 ? void 0 : _e.x,
+                (_f = middlewareData.transformOrigin) === null || _f === void 0 ? void 0 : _f.y,
+            ].join(" ") }), 
+        // Floating UI uses the `dir` attribute on the reference/floating node for logical alignment.
+        // This attribute is necessary for both portalled and inline calculations.
+        dir: "ltr" },
+        React.createElement(FloatingContentProvider, { placedSide: placedSide, onArrowChange: setArrow, arrowX: arrowX, arrowY: arrowY, hideArrow: cannotCenterArrow },
+            React.createElement("div", Object.assign({ ref: mergeRefs, "data-side": placedSide, "data-align": placedAlign }, contentProps, { style: Object.assign(Object.assign({}, contentProps.style), { 
+                    // if the FloatingContent hasn't been placed yet (not all measurements done)
+                    // we prevent animations so that users's animation don't kick in too early referring wrong sides
+                    animation: !isPositioned ? "none" : undefined, 
+                    // hide the content if using the hide middleware and should be hidden
+                    opacity: ((_g = middlewareData.hide) === null || _g === void 0 ? void 0 : _g.referenceHidden) ? 0 : undefined }) }),
+                children,
+                (_arrow === null || _arrow === void 0 ? void 0 : _arrow.height) && (_arrow === null || _arrow === void 0 ? void 0 : _arrow.width) && (React.createElement(FloatingArrow, { width: _arrow.width, height: _arrow.height, className: _arrow.className }))))));
+});
+Floating.Anchor = FloatingAnchor;
+Floating.Content = FloatingContent;
+export { Floating };
+//# sourceMappingURL=Floating.js.map

package/esm/overlays/floating/Floating.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Floating.js","sourceRoot":"","sources":["../../../src/overlays/floating/Floating.tsx"],"names":[],"mappings":"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"}

package/esm/overlays/floating/Floating.utils.d.ts

@@ -0,0 +1,18 @@
+import type { Middleware, Placement } from "@floating-ui/react-dom";
+declare const SIDE_OPTIONS: readonly ["top", "right", "bottom", "left"];
+declare const ALIGN_OPTIONS: readonly ["start", "center", "end"];
+type Side = (typeof SIDE_OPTIONS)[number];
+type Align = (typeof ALIGN_OPTIONS)[number];
+type Measurable = {
+    getBoundingClientRect(): DOMRect;
+};
+/**
+ * `transformOrigin` is a custom middleware for floating-ui that calculates the transform origin of the floating-element.
+ */
+declare function transformOrigin(options: {
+    arrowWidth: number;
+    arrowHeight: number;
+}): Middleware;
+declare function getSideAndAlignFromPlacement(placement: Placement): readonly ["left" | "right" | "bottom" | "top", "center" | "start" | "end"];
+export { getSideAndAlignFromPlacement, transformOrigin };
+export type { Side, Align, Measurable };

package/esm/overlays/floating/Floating.utils.js

@@ -0,0 +1,48 @@
+const SIDE_OPTIONS = ["top", "right", "bottom", "left"];
+const ALIGN_OPTIONS = ["start", "center", "end"];
+/**
+ * `transformOrigin` is a custom middleware for floating-ui that calculates the transform origin of the floating-element.
+ */
+function transformOrigin(options) {
+    return {
+        name: "transformOrigin",
+        options,
+        fn(data) {
+            var _a, _b, _c, _d, _e;
+            const { placement, rects, middlewareData } = data;
+            const cannotCenterArrow = ((_a = middlewareData.arrow) === null || _a === void 0 ? void 0 : _a.centerOffset) !== 0;
+            const isArrowHidden = cannotCenterArrow;
+            const arrowWidth = isArrowHidden ? 0 : options.arrowWidth;
+            const arrowHeight = isArrowHidden ? 0 : options.arrowHeight;
+            const [placedSide, placedAlign] = getSideAndAlignFromPlacement(placement);
+            const noArrowAlign = { start: "0%", center: "50%", end: "100%" }[placedAlign];
+            const arrowXCenter = ((_c = (_b = middlewareData.arrow) === null || _b === void 0 ? void 0 : _b.x) !== null && _c !== void 0 ? _c : 0) + arrowWidth / 2;
+            const arrowYCenter = ((_e = (_d = middlewareData.arrow) === null || _d === void 0 ? void 0 : _d.y) !== null && _e !== void 0 ? _e : 0) + arrowHeight / 2;
+            let x = "";
+            let y = "";
+            if (placedSide === "bottom") {
+                x = isArrowHidden ? noArrowAlign : `${arrowXCenter}px`;
+                y = `${-arrowHeight}px`;
+            }
+            else if (placedSide === "top") {
+                x = isArrowHidden ? noArrowAlign : `${arrowXCenter}px`;
+                y = `${rects.floating.height + arrowHeight}px`;
+            }
+            else if (placedSide === "right") {
+                x = `${-arrowHeight}px`;
+                y = isArrowHidden ? noArrowAlign : `${arrowYCenter}px`;
+            }
+            else if (placedSide === "left") {
+                x = `${rects.floating.width + arrowHeight}px`;
+                y = isArrowHidden ? noArrowAlign : `${arrowYCenter}px`;
+            }
+            return { data: { x, y } };
+        },
+    };
+}
+function getSideAndAlignFromPlacement(placement) {
+    const [side, align = "center"] = placement.split("-");
+    return [side, align];
+}
+export { getSideAndAlignFromPlacement, transformOrigin };
+//# sourceMappingURL=Floating.utils.js.map

package/esm/overlays/floating/Floating.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Floating.utils.js","sourceRoot":"","sources":["../../../src/overlays/floating/Floating.utils.ts"],"names":[],"mappings":"AAEA,MAAM,YAAY,GAAG,CAAC,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,CAAU,CAAC;AACjE,MAAM,aAAa,GAAG,CAAC,OAAO,EAAE,QAAQ,EAAE,KAAK,CAAU,CAAC;AAM1D;;GAEG;AACH,SAAS,eAAe,CAAC,OAGxB;IACC,OAAO;QACL,IAAI,EAAE,iBAAiB;QACvB,OAAO;QACP,EAAE,CAAC,IAAI;;YACL,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,cAAc,EAAE,GAAG,IAAI,CAAC;YAElD,MAAM,iBAAiB,GAAG,CAAA,MAAA,cAAc,CAAC,KAAK,0CAAE,YAAY,MAAK,CAAC,CAAC;YACnE,MAAM,aAAa,GAAG,iBAAiB,CAAC;YACxC,MAAM,UAAU,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,UAAU,CAAC;YAC1D,MAAM,WAAW,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,WAAW,CAAC;YAE5D,MAAM,CAAC,UAAU,EAAE,WAAW,CAAC,GAAG,4BAA4B,CAAC,SAAS,CAAC,CAAC;YAC1E,MAAM,YAAY,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,CAC9D,WAAW,CACZ,CAAC;YAEF,MAAM,YAAY,GAAG,CAAC,MAAA,MAAA,cAAc,CAAC,KAAK,0CAAE,CAAC,mCAAI,CAAC,CAAC,GAAG,UAAU,GAAG,CAAC,CAAC;YACrE,MAAM,YAAY,GAAG,CAAC,MAAA,MAAA,cAAc,CAAC,KAAK,0CAAE,CAAC,mCAAI,CAAC,CAAC,GAAG,WAAW,GAAG,CAAC,CAAC;YAEtE,IAAI,CAAC,GAAG,EAAE,CAAC;YACX,IAAI,CAAC,GAAG,EAAE,CAAC;YAEX,IAAI,UAAU,KAAK,QAAQ,EAAE,CAAC;gBAC5B,CAAC,GAAG,aAAa,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,GAAG,YAAY,IAAI,CAAC;gBACvD,CAAC,GAAG,GAAG,CAAC,WAAW,IAAI,CAAC;YAC1B,CAAC;iBAAM,IAAI,UAAU,KAAK,KAAK,EAAE,CAAC;gBAChC,CAAC,GAAG,aAAa,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,GAAG,YAAY,IAAI,CAAC;gBACvD,CAAC,GAAG,GAAG,KAAK,CAAC,QAAQ,CAAC,MAAM,GAAG,WAAW,IAAI,CAAC;YACjD,CAAC;iBAAM,IAAI,UAAU,KAAK,OAAO,EAAE,CAAC;gBAClC,CAAC,GAAG,GAAG,CAAC,WAAW,IAAI,CAAC;gBACxB,CAAC,GAAG,aAAa,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,GAAG,YAAY,IAAI,CAAC;YACzD,CAAC;iBAAM,IAAI,UAAU,KAAK,MAAM,EAAE,CAAC;gBACjC,CAAC,GAAG,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,GAAG,WAAW,IAAI,CAAC;gBAC9C,CAAC,GAAG,aAAa,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,GAAG,YAAY,IAAI,CAAC;YACzD,CAAC;YACD,OAAO,EAAE,IAAI,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;QAC5B,CAAC;KACF,CAAC;AACJ,CAAC;AAED,SAAS,4BAA4B,CAAC,SAAoB;IACxD,MAAM,CAAC,IAAI,EAAE,KAAK,GAAG,QAAQ,CAAC,GAAG,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IACtD,OAAO,CAAC,IAAY,EAAE,KAAc,CAAU,CAAC;AACjD,CAAC;AAED,OAAO,EAAE,4BAA4B,EAAE,eAAe,EAAE,CAAC"}

package/esm/popover/Popover.js

@@ -9,12 +9,13 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { autoUpdate, arrow as flArrow, offset as flOffset, flip, shift, useClick, useDismiss, useFloating, useInteractions, } from "@floating-ui/react";
+import { autoUpdate, arrow as flArrow, offset as flOffset, flip, shift, useFloating, } from "@floating-ui/react";
 import cl from "clsx";
-import React, { forwardRef, useCallback, useContext, useRef, } from "react";
+import React, { forwardRef, useContext, useRef } from "react";
 import { DateContext } from "../date/context/index.js";
 import { useModalContext } from "../modal/Modal.context.js";
-import { useClientLayoutEffect, useEventListener } from "../util/hooks/index.js";
+import { DismissableLayer } from "../overlay/dismiss/DismissableLayer.js";
+import { useClientLayoutEffect } from "../util/hooks/index.js";
 import { useMergeRefs } from "../util/hooks/useMergeRefs.js";
 import PopoverContent from "./PopoverContent.js";
 /**
@@ -44,11 +45,10 @@ export const Popover = forwardRef((_a, ref) => {
     const isInDatepicker = useContext(DateContext) !== null;
     const chosenStrategy = userStrategy !== null && userStrategy !== void 0 ? userStrategy : (isInModal ? "fixed" : "absolute");
     const chosenFlip = isInDatepicker ? false : _flip;
-    const { x, y, strategy, context, update, refs, placement: flPlacement, middlewareData: { arrow: { x: arrowX, y: arrowY } = {} }, } = useFloating({
+    const { update, refs, placement: flPlacement, middlewareData: { arrow: { x: arrowX, y: arrowY } = {} }, floatingStyles, } = useFloating({
         strategy: chosenStrategy,
         placement,
         open,
-        onOpenChange: () => onClose(),
         middleware: [
             flOffset(offset !== null && offset !== void 0 ? offset : (arrow ? 16 : 4)),
             chosenFlip &&
@@ -57,10 +57,6 @@ export const Popover = forwardRef((_a, ref) => {
             flArrow({ element: arrowRef, padding: 8 }),
         ],
     });
-    const { getFloatingProps } = useInteractions([
-        useClick(context),
-        useDismiss(context),
-    ]);
     useClientLayoutEffect(() => {
         refs.setReference(anchorEl);
     }, [anchorEl]);
@@ -71,34 +67,23 @@ export const Popover = forwardRef((_a, ref) => {
         const cleanup = autoUpdate(refs.reference.current, refs.floating.current, update);
         return () => cleanup();
     }, [refs.floating, refs.reference, update, open, anchorEl]);
-    useEventListener("focusin", useCallback((e) => {
-        if (e.target instanceof HTMLElement &&
-            ![anchorEl, refs.floating.current].some((element) => element === null || element === void 0 ? void 0 : element.contains(e.target)) &&
-            !e.target.contains(refs.floating.current)) {
-            open && onClose();
-        }
-    }, [anchorEl, refs, open, onClose]));
     const staticSide = {
         top: "bottom",
         right: "left",
         bottom: "top",
         left: "right",
     }[flPlacement.split("-")[0]];
-    return (React.createElement("div", Object.assign({ className: cl("navds-popover", className, {
-            "navds-popover--hidden": !open || !anchorEl,
-        }), "data-placement": flPlacement, "aria-hidden": !open || !anchorEl }, getFloatingProps({
-        ref: floatingRef,
-        style: {
-            position: strategy,
-            top: y !== null && y !== void 0 ? y : 0,
-            left: x !== null && x !== void 0 ? x : 0,
-        },
-        tabIndex: undefined,
-    }), rest),
-        children,
-        arrow && (React.createElement("div", { ref: (node) => {
-                arrowRef.current = node;
-            }, style: Object.assign(Object.assign(Object.assign({}, (arrowX != null ? { left: arrowX } : {})), (arrowY != null ? { top: arrowY } : {})), (staticSide ? { [staticSide]: "-0.5rem" } : {})), className: "navds-popover__arrow" }))));
+    return (React.createElement(DismissableLayer, { asChild: true, safeZone: {
+            anchor: anchorEl,
+            dismissable: refs.floating.current,
+        }, onDismiss: () => open && (onClose === null || onClose === void 0 ? void 0 : onClose()), enabled: open },
+        React.createElement("div", Object.assign({ ref: floatingRef }, rest, { className: cl("navds-popover", className, {
+                "navds-popover--hidden": !open || !anchorEl,
+            }), style: Object.assign(Object.assign({}, rest.style), floatingStyles), "data-placement": flPlacement, "aria-hidden": !open || !anchorEl }),
+            children,
+            arrow && (React.createElement("div", { ref: (node) => {
+                    arrowRef.current = node;
+                }, style: Object.assign(Object.assign(Object.assign({}, (arrowX != null ? { left: arrowX } : {})), (arrowY != null ? { top: arrowY } : {})), (staticSide ? { [staticSide]: "-0.5rem" } : {})), className: "navds-popover__arrow" })))));
 });
 Popover.Content = PopoverContent;
 export default Popover;

package/esm/popover/Popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.js","sourceRoot":"","sources":["../../src/popover/Popover.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Popover.js","sourceRoot":"","sources":["../../src/popover/Popover.tsx"],"names":[],"mappings":"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"}

package/esm/progress-bar/ProgressBar.d.ts

@@ -6,7 +6,7 @@ interface ProgressBarPropsBase extends Omit<HTMLAttributes<HTMLDivElement>, "rol
      */
     size?: "large" | "medium" | "small";
     /**
-     * Current progress. When duration is set, value is ignored.
+     * Current progress. If set, the `simulated` prop overrides `value`.
      */
     value?: number;
     /**
@@ -15,12 +15,20 @@ interface ProgressBarPropsBase extends Omit<HTMLAttributes<HTMLDivElement>, "rol
      */
     valueMax?: number;
     /**
-     * Expected task duration in seconds.
-     * ProgressBar grows with a preset animation for {duration} seconds.
-     * After a 4 sec delay, it then shows an indeterminate animation.
-     * A duration of 0 will show an indeterminate animation immediately.
-     * Temporary removed to avoid conflicts when updating API
+     * Visually simulates loading.
+     * ProgressBar grows with a preset animation for set number of seconds,
+     * then shows an indeterminate animation on timeout.
      */
+    simulated?: {
+        /**
+         * Duration in seconds.
+         */
+        seconds: number;
+        /**
+         * Callback function when progress is indeterminate.
+         */
+        onTimeout: () => void;
+    };
     /**
      * String ID of the element that labels the progress bar.
      * Not needed if `aria-label` is used.
@@ -33,7 +41,7 @@ interface ProgressBarPropsBase extends Omit<HTMLAttributes<HTMLDivElement>, "rol
     "aria-label"?: string;
 }
 export type ProgressBarProps = ProgressBarPropsBase & ({
-    "aria-hidden": string;
+    "aria-hidden": true;
 } | {
     "aria-labelledby": string;
     "aria-label"?: never;
@@ -50,7 +58,11 @@ export type ProgressBarProps = ProgressBarPropsBase & ({
  *
  * @example
  * // For loading content with an approximate duration in sec.
- * <ProgressBar duration={30} />
+ * <ProgressBar simulated={{
+ *     seconds: 30,
+ *     onTimeout: () => console.log("Oops, this is taking more time than expected!")
+ *   }}
+ * />
  *
  * @example
  * // As a step indicator for forms, questionnaires, etc.