@expofp/ui 0.0.0-experimental.cf063fc

package/dist/components/WayfindingFloorSelector/WayfindingFloorSelector.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import './WayfindingFloorSelector.scss';
+import cn from 'classnames';
+import React from 'react';
+const WayfindingFloorSelector = ({ floors, value, floorSelectionLabel = 'Floor selection', onSelect, }) => {
+    const currentIndex = floors.findIndex((floor) => floor?.id === value?.id);
+    const isNextArrow = (index) => {
+        return currentIndex !== -1 && index === currentIndex;
+    };
+    return (_jsx("div", { className: "efp-wayfinding-floor", children: _jsx("div", { className: "efp-wayfinding-floor__body", children: _jsx("div", { className: "efp-wayfinding-floor__list", role: "radiogroup", "aria-label": floorSelectionLabel, children: floors.map((floor, index) => {
+                    const isCurrent = floor?.id === value?.id;
+                    const isPassed = currentIndex !== -1 && index < currentIndex;
+                    const isLast = index === floors.length - 1;
+                    const arrowDirection = isLast ? null : (floor.directionToNext ?? null);
+                    const shouldBlink = isNextArrow(index);
+                    const isArrowPassed = currentIndex !== -1 && index < currentIndex;
+                    return (_jsxs(React.Fragment, { children: [_jsx("div", { className: cn('efp-wayfinding-floor__item', {
+                                    'is-current': isCurrent,
+                                    'is-passed': isPassed,
+                                }), children: _jsx("button", { type: "button", role: "radio", title: floor.description, "aria-checked": isCurrent, "aria-label": floor.ariaLabel ?? floor.description ?? floor.name, onClick: () => onSelect?.({ id: floor.id, name: floor.name }), children: _jsx("span", { children: floor.name }) }) }), !isLast && arrowDirection && (_jsx("div", { className: cn('efp-wayfinding-floor__arrow', {
+                                    [`efp-wayfinding-floor__arrow--${arrowDirection}`]: arrowDirection,
+                                    'efp-wayfinding-floor__arrow--blink': shouldBlink,
+                                    'efp-wayfinding-floor__arrow--passed': isArrowPassed,
+                                }), "aria-hidden": "true", children: isArrowPassed || shouldBlink ? (_jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M11.7502 18.2823C11.7503 19.0928 12.4074 19.7499 13.218 19.75C13.5885 19.75 13.9455 19.6096 14.217 19.3575L20.6438 13.3897C21.0303 13.0308 21.2502 12.5274 21.2502 12C21.2502 11.4727 21.0303 10.9693 20.6438 10.6104L14.217 4.64258C13.9795 4.42202 13.6768 4.28716 13.3566 4.25684L13.218 4.25L13.0686 4.25782C12.3282 4.3328 11.7503 4.95766 11.7502 5.71778L11.7502 8.25L4.50024 8.25C3.53374 8.25 2.75024 9.03351 2.75024 9.99996L2.75024 14C2.75024 14.9665 3.53374 15.75 4.50024 15.75L11.7502 15.75L11.7502 18.2823Z", fill: "currentColor" }) })) : (_jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M2.5 10C2.5 8.89544 3.39544 8 4.5 8H11.5V5.71777C11.5001 4.76912 12.2692 4.00012 13.2178 4C13.5973 4 13.9649 4.12537 14.2637 4.35449L14.3867 4.45898L20.8145 10.4268C21.2518 10.8329 21.5 11.4032 21.5 12C21.5 12.5968 21.2518 13.1671 20.8145 13.5732L14.3867 19.54L14.3877 19.541C14.0697 19.8365 13.6514 20 13.2178 20C12.2692 19.9999 11.5001 19.2308 11.5 18.2822V16H4.5C3.39545 16 2.5 15.1046 2.5 14V10ZM4.5 14H12.5C13.0523 14 13.5 14.4477 13.5 15V17.6348L19.4531 12.1074C19.4829 12.0797 19.5 12.0407 19.5 12C19.5 11.9593 19.4829 11.9203 19.4531 11.8926L13.5 6.36426V9C13.5 9.55228 13.0523 10 12.5 10H4.5V14Z", fill: "currentColor" }) })) }))] }, floor.id));
+                }) }) }) }));
+};
+export default WayfindingFloorSelector;

package/dist/components/WayfindingFloorSelector/index.d.ts

@@ -0,0 +1,3 @@
+export type { WayfindingFloorSelectorFloor, WayfindingFloorSelectorProps, } from './WayfindingFloorSelector';
+export { default } from './WayfindingFloorSelector';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/WayfindingFloorSelector/index.js

@@ -0,0 +1 @@
+export { default } from './WayfindingFloorSelector';

package/dist/index.d.ts

@@ -0,0 +1,74 @@
+export * from './components/Alert';
+export { default as Alert } from './components/Alert';
+export * from './components/Autocomplete';
+export { default as Autocomplete } from './components/Autocomplete';
+export * from './components/Badge';
+export { default as Badge } from './components/Badge';
+export * from './components/Button';
+export { default as Button } from './components/Button';
+export * from './components/Checkbox';
+export { default as Checkbox } from './components/Checkbox';
+export * from './components/CheckboxButton';
+export { default as CheckboxButton } from './components/CheckboxButton';
+export * from './components/DownloadList';
+export { default as DownloadList } from './components/DownloadList';
+export * from './components/Draggable';
+export { default as Draggable } from './components/Draggable';
+export * from './components/EntityItem';
+export { default as EntityItem } from './components/EntityItem';
+export * from './components/EventBadge';
+export { default as EventBadge } from './components/EventBadge';
+export * from './components/Gallery';
+export { default as Gallery } from './components/Gallery';
+export * from './components/HeatmapLegend';
+export { default as HeatmapLegend } from './components/HeatmapLegend';
+export { default as HighlightText } from './components/HighlightText';
+export * from './components/LevelBadge';
+export { default as LevelBadge } from './components/LevelBadge';
+export * from './components/LevelSelector';
+export { default as LevelSelector } from './components/LevelSelector';
+export * from './components/MapControls';
+export { default as MapControls } from './components/MapControls';
+export * from './components/MobileToggleButton';
+export { default as MobileToggleButton } from './components/MobileToggleButton';
+export * from './components/Modal';
+export { default as Modal } from './components/Modal';
+export * from './components/MultiSelectGroups';
+export { default as MultiSelectGroups } from './components/MultiSelectGroups';
+export * from './components/Overlay';
+export { default as Overlay } from './components/Overlay';
+export * from './components/OverlayGrip';
+export { default as OverlayGrip } from './components/OverlayGrip';
+export * from './components/PermissionNotice';
+export { default as PermissionNotice } from './components/PermissionNotice';
+export * from './components/PlanSelector';
+export { default as PlanSelector } from './components/PlanSelector';
+export * from './components/Radio';
+export { default as Radio } from './components/Radio';
+export * from './components/RebookingNotes';
+export { default as RebookingNotes } from './components/RebookingNotes';
+export * from './components/RebookingRadioGroup';
+export { default as RebookingRadioGroup } from './components/RebookingRadioGroup';
+export * from './components/ScrollableRow';
+export { default as ScrollableRow } from './components/ScrollableRow';
+export * from './components/Share';
+export { default as Share } from './components/Share';
+export * from './components/ShowMoreButton';
+export { default as ShowMoreButton } from './components/ShowMoreButton';
+export * from './components/SidebarActions';
+export { default as SidebarActions } from './components/SidebarActions';
+export * from './components/SimpleRow';
+export { default as SimpleRow } from './components/SimpleRow';
+export * from './components/Spinner';
+export { default as Spinner } from './components/Spinner';
+export * from './components/ToggleButton';
+export { default as ToggleButton } from './components/ToggleButton';
+export * from './components/ToggleSwitch';
+export { default as ToggleSwitch } from './components/ToggleSwitch';
+export { default as TouchHand } from './components/TouchHand';
+export * from './components/VenuePicker';
+export { default as VenuePicker } from './components/VenuePicker';
+export * from './components/WayfindingFloorSelector';
+export { default as WayfindingFloorSelector } from './components/WayfindingFloorSelector';
+export type { SelectorOption } from './shared/selector-option.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.js

@@ -0,0 +1,77 @@
+// Public entry point for @expofp/ui — pure, presentational React components
+// extracted from @expofp/floorplan. See README for scope rules.
+//
+// Each component is default-exported from its folder; the barrel re-publishes it
+// as a named export plus its public types.
+export * from './components/Alert';
+export { default as Alert } from './components/Alert';
+export * from './components/Autocomplete';
+export { default as Autocomplete } from './components/Autocomplete';
+export * from './components/Badge';
+export { default as Badge } from './components/Badge';
+export * from './components/Button';
+export { default as Button } from './components/Button';
+export * from './components/Checkbox';
+export { default as Checkbox } from './components/Checkbox';
+export * from './components/CheckboxButton';
+export { default as CheckboxButton } from './components/CheckboxButton';
+export * from './components/DownloadList';
+export { default as DownloadList } from './components/DownloadList';
+export * from './components/Draggable';
+export { default as Draggable } from './components/Draggable';
+export * from './components/EntityItem';
+export { default as EntityItem } from './components/EntityItem';
+export * from './components/EventBadge';
+export { default as EventBadge } from './components/EventBadge';
+export * from './components/Gallery';
+export { default as Gallery } from './components/Gallery';
+export * from './components/HeatmapLegend';
+export { default as HeatmapLegend } from './components/HeatmapLegend';
+export { default as HighlightText } from './components/HighlightText';
+export * from './components/LevelBadge';
+export { default as LevelBadge } from './components/LevelBadge';
+export * from './components/LevelSelector';
+export { default as LevelSelector } from './components/LevelSelector';
+export * from './components/MapControls';
+export { default as MapControls } from './components/MapControls';
+export * from './components/MobileToggleButton';
+export { default as MobileToggleButton } from './components/MobileToggleButton';
+export * from './components/Modal';
+export { default as Modal } from './components/Modal';
+export * from './components/MultiSelectGroups';
+export { default as MultiSelectGroups } from './components/MultiSelectGroups';
+export * from './components/Overlay';
+export { default as Overlay } from './components/Overlay';
+export * from './components/OverlayGrip';
+export { default as OverlayGrip } from './components/OverlayGrip';
+export * from './components/PermissionNotice';
+export { default as PermissionNotice } from './components/PermissionNotice';
+export * from './components/PlanSelector';
+export { default as PlanSelector } from './components/PlanSelector';
+export * from './components/Radio';
+export { default as Radio } from './components/Radio';
+export * from './components/RebookingNotes';
+export { default as RebookingNotes } from './components/RebookingNotes';
+export * from './components/RebookingRadioGroup';
+export { default as RebookingRadioGroup } from './components/RebookingRadioGroup';
+export * from './components/ScrollableRow';
+export { default as ScrollableRow } from './components/ScrollableRow';
+export * from './components/Share';
+export { default as Share } from './components/Share';
+export * from './components/ShowMoreButton';
+export { default as ShowMoreButton } from './components/ShowMoreButton';
+export * from './components/SidebarActions';
+export { default as SidebarActions } from './components/SidebarActions';
+export * from './components/SimpleRow';
+export { default as SimpleRow } from './components/SimpleRow';
+export * from './components/Spinner';
+export { default as Spinner } from './components/Spinner';
+export * from './components/ToggleButton';
+export { default as ToggleButton } from './components/ToggleButton';
+export * from './components/ToggleSwitch';
+export { default as ToggleSwitch } from './components/ToggleSwitch';
+export { default as TouchHand } from './components/TouchHand';
+export * from './components/VenuePicker';
+export { default as VenuePicker } from './components/VenuePicker';
+export * from './components/WayfindingFloorSelector';
+export { default as WayfindingFloorSelector } from './components/WayfindingFloorSelector';

package/dist/shared/activeElement.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Focused element within `element`'s tree, descending into nested shadow trees.
+ * `document.activeElement` retargets to the shadow host, so it cannot be
+ * compared against elements rendered inside a shadow root.
+ */
+export declare function getActiveElement(element: Element | null): Element | null;
+//# sourceMappingURL=activeElement.d.ts.map

package/dist/shared/activeElement.js

@@ -0,0 +1,14 @@
+const isFocusRoot = (node) => !!node && 'activeElement' in node;
+/**
+ * Focused element within `element`'s tree, descending into nested shadow trees.
+ * `document.activeElement` retargets to the shadow host, so it cannot be
+ * compared against elements rendered inside a shadow root.
+ */
+export function getActiveElement(element) {
+    const root = element?.getRootNode();
+    let active = isFocusRoot(root) ? root.activeElement : document.activeElement;
+    while (active?.shadowRoot?.activeElement) {
+        active = active.shadowRoot.activeElement;
+    }
+    return active;
+}

package/dist/shared/debounce.d.ts

@@ -0,0 +1,2 @@
+export default function debounce<Params extends unknown[]>(func: (...args: Params) => unknown, timeoutMs: number): (...args: Params) => void;
+//# sourceMappingURL=debounce.d.ts.map

package/dist/shared/debounce.js

@@ -0,0 +1,9 @@
+export default function debounce(func, timeoutMs) {
+    let timer;
+    return (...args) => {
+        clearTimeout(timer);
+        timer = setTimeout(() => {
+            func(...args);
+        }, timeoutMs);
+    };
+}

package/dist/shared/hooks/useKeyboardInset.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Height in px of the on-screen keyboard covering the layout viewport's bottom,
+ * or 0. The keyboard shrinks `visualViewport` while `innerHeight` stays put
+ * (#1567). iOS additionally pans the layout viewport to reveal the focused
+ * input; tracking that pan means chasing it (iOS re-pans after every lift), so
+ * the inset is the keyboard height alone and the pan is undone instead.
+ */
+export declare const useKeyboardInset: (enabled: boolean) => number;
+//# sourceMappingURL=useKeyboardInset.d.ts.map

package/dist/shared/hooks/useKeyboardInset.js

@@ -0,0 +1,84 @@
+import { useEffect, useRef, useState } from 'react';
+/** Anything smaller is browser-chrome noise (URL bar collapse), not a keyboard. */
+const MIN_KEYBOARD_HEIGHT = 100;
+/** px of drift to absorb — iOS reports fractional heights while the keyboard settles. */
+const INSET_TOLERANCE = 2;
+/** A keyboard never covers more than this; anything larger is a geometry glitch. */
+const MAX_INSET_RATIO = 0.6;
+/** Unzoomed scale is not exactly 1 in every Android WebView — 1.0000001 happens. */
+const SCALE_TOLERANCE = 0.01;
+/**
+ * Height in px of the on-screen keyboard covering the layout viewport's bottom,
+ * or 0. The keyboard shrinks `visualViewport` while `innerHeight` stays put
+ * (#1567). iOS additionally pans the layout viewport to reveal the focused
+ * input; tracking that pan means chasing it (iOS re-pans after every lift), so
+ * the inset is the keyboard height alone and the pan is undone instead.
+ */
+export const useKeyboardInset = (enabled) => {
+    const [inset, setInset] = useState(0);
+    const insetRef = useRef(0);
+    const pinnedScrollRef = useRef(null);
+    useEffect(() => {
+        if (!enabled) {
+            setInset(0);
+            insetRef.current = 0;
+            pinnedScrollRef.current = null;
+            return;
+        }
+        const viewport = typeof window.visualViewport !== 'undefined' ? window.visualViewport : null;
+        if (!viewport)
+            return;
+        const read = () => {
+            const covered = window.innerHeight - viewport.height;
+            // Pinch zoom also shrinks the visual viewport — only an unzoomed shrink counts.
+            if (Math.abs(viewport.scale - 1) >= SCALE_TOLERANCE || covered <= MIN_KEYBOARD_HEIGHT) {
+                return 0;
+            }
+            return Math.round(Math.min(covered, window.innerHeight * MAX_INSET_RATIO));
+        };
+        // Undoing the pan scrolls the whole window — ours to do only when the SDK
+        // owns it, not embedded in a `<div>` on a scrollable host page.
+        const ownsViewport = () => document.documentElement.scrollHeight <= window.innerHeight + INSET_TOLERANCE;
+        const apply = (next) => {
+            if (Math.abs(next - insetRef.current) <= INSET_TOLERANCE)
+                return;
+            // Remember where the page stood before the keyboard pushed it around.
+            if (insetRef.current === 0) {
+                pinnedScrollRef.current = ownsViewport() ? window.scrollY : null;
+            }
+            if (next === 0)
+                pinnedScrollRef.current = null;
+            insetRef.current = next;
+            setInset(next);
+        };
+        // The keyboard animating in fires a burst of events; render the last value
+        // of each frame, or the sheet jitters (#1567).
+        let frame = 0;
+        const onResize = () => {
+            if (frame)
+                return;
+            frame = requestAnimationFrame(() => {
+                frame = 0;
+                apply(read());
+            });
+        };
+        // The lift already reveals the input, so the iOS pan is pure damage: undo it.
+        const onScroll = () => {
+            const pinned = pinnedScrollRef.current;
+            if (pinned === null || insetRef.current === 0)
+                return;
+            if (Math.abs(window.scrollY - pinned) > INSET_TOLERANCE)
+                window.scrollTo(0, pinned);
+        };
+        apply(read());
+        viewport.addEventListener('resize', onResize);
+        viewport.addEventListener('scroll', onScroll);
+        return () => {
+            if (frame)
+                cancelAnimationFrame(frame);
+            viewport.removeEventListener('resize', onResize);
+            viewport.removeEventListener('scroll', onScroll);
+        };
+    }, [enabled]);
+    return inset;
+};

package/dist/shared/hooks/useOnClickOutside.d.ts

@@ -0,0 +1,14 @@
+import { type RefObject } from 'react';
+type Ref = RefObject<HTMLElement | null>;
+/**
+ * Calls `handler` when a click or touch lands outside every ref in `refs`,
+ * while `enabled` is true.
+ *
+ * The listeners are attached to `document`. Both `refs` and `handler` are held
+ * in refs, so passing an inline array/arrow does not re-subscribe on every
+ * render — the listeners are only (re)attached when `enabled` flips. Pass the
+ * open state as `enabled` so the listeners exist only while the popup is open.
+ */
+declare function useOnClickOutside(refs: Ref | Ref[], handler: (event: Event) => void, enabled?: boolean): void;
+export default useOnClickOutside;
+//# sourceMappingURL=useOnClickOutside.d.ts.map

package/dist/shared/hooks/useOnClickOutside.js

@@ -0,0 +1,43 @@
+import { useEffect, useRef } from 'react';
+/**
+ * Calls `handler` when a click or touch lands outside every ref in `refs`,
+ * while `enabled` is true.
+ *
+ * The listeners are attached to `document`. Both `refs` and `handler` are held
+ * in refs, so passing an inline array/arrow does not re-subscribe on every
+ * render — the listeners are only (re)attached when `enabled` flips. Pass the
+ * open state as `enabled` so the listeners exist only while the popup is open.
+ */
+function useOnClickOutside(refs, handler, enabled = true) {
+    const refsRef = useRef(refs);
+    const handlerRef = useRef(handler);
+    useEffect(() => {
+        refsRef.current = refs;
+        handlerRef.current = handler;
+    });
+    useEffect(() => {
+        if (!enabled) {
+            return;
+        }
+        const listener = (event) => {
+            const refArray = Array.isArray(refsRef.current) ? refsRef.current : [refsRef.current];
+            const isClickInside = refArray.some((ref) => {
+                if (!ref?.current)
+                    return false;
+                const target = event.target;
+                return (ref.current.contains(target) ||
+                    (event.composed && ref.current.contains(event.composedPath()[0])));
+            });
+            if (!isClickInside) {
+                handlerRef.current(event);
+            }
+        };
+        document.addEventListener('click', listener);
+        document.addEventListener('touchstart', listener);
+        return () => {
+            document.removeEventListener('click', listener);
+            document.removeEventListener('touchstart', listener);
+        };
+    }, [enabled]);
+}
+export default useOnClickOutside;

package/dist/shared/hooks/useOnEscape.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Calls `handler` when the Escape key is pressed while `enabled` is true.
+ *
+ * The listener is attached to `document`, so Escape is caught regardless of
+ * where focus currently sits. The handler is held in a ref, so passing an
+ * inline arrow does not re-subscribe the listener on every render — it only
+ * re-subscribes when `enabled` flips.
+ *
+ * Focus management (e.g. returning focus to a trigger) is left to the caller's
+ * handler, since which element to focus is component-specific.
+ */
+declare function useOnEscape(handler: () => void, enabled?: boolean): void;
+export default useOnEscape;
+//# sourceMappingURL=useOnEscape.d.ts.map

package/dist/shared/hooks/useOnEscape.js

@@ -0,0 +1,31 @@
+import { useEffect, useRef } from 'react';
+/**
+ * Calls `handler` when the Escape key is pressed while `enabled` is true.
+ *
+ * The listener is attached to `document`, so Escape is caught regardless of
+ * where focus currently sits. The handler is held in a ref, so passing an
+ * inline arrow does not re-subscribe the listener on every render — it only
+ * re-subscribes when `enabled` flips.
+ *
+ * Focus management (e.g. returning focus to a trigger) is left to the caller's
+ * handler, since which element to focus is component-specific.
+ */
+function useOnEscape(handler, enabled = true) {
+    const handlerRef = useRef(handler);
+    useEffect(() => {
+        handlerRef.current = handler;
+    });
+    useEffect(() => {
+        if (!enabled) {
+            return;
+        }
+        const onKeyDown = (event) => {
+            if (event.key === 'Escape') {
+                handlerRef.current();
+            }
+        };
+        document.addEventListener('keydown', onKeyDown);
+        return () => document.removeEventListener('keydown', onKeyDown);
+    }, [enabled]);
+}
+export default useOnEscape;

package/dist/shared/hooks/useSheetDrag.d.ts

@@ -0,0 +1,28 @@
+import { type PointerEvent as ReactPointerEvent, type RefObject } from 'react';
+export interface SnapPoint<T extends string> {
+    name: T;
+    height: number;
+}
+interface UseSheetDragOptions<T extends string> {
+    enabled: boolean;
+    panelRef: RefObject<HTMLDivElement | null>;
+    /** An element, not a ref: the touchmove listener has to follow it as it mounts. */
+    scrollElement: HTMLDivElement | null;
+    /** Ascending by height; the last one is the tallest. */
+    snapPoints: readonly SnapPoint<T>[];
+    current: T;
+    /** `performance.now()` of the last open, or undefined while the sheet is closed. */
+    openedAtRef: RefObject<number | undefined>;
+    /** Freeze the sheet at its tallest point; fires before the first drawn move. */
+    onDragStart: () => void;
+    /** Fires on release, while the sheet animates to the chosen point. */
+    onSnap: (name: T) => void;
+    /** The animation has landed; the host resumes its height-driven layout. */
+    onSettle: () => void;
+    onHandleTap: () => void;
+}
+export declare function useSheetDrag<T extends string>({ enabled, panelRef, scrollElement, snapPoints, current, openedAtRef, onDragStart, onSnap, onSettle, onHandleTap, }: UseSheetDragOptions<T>): {
+    onPointerDown: (event: ReactPointerEvent<HTMLDivElement>) => void;
+};
+export {};
+//# sourceMappingURL=useSheetDrag.d.ts.map