@expofp/floorplan 0.0.0-experimental.2d6c681

package/dist/esm/components/Schedule.js

@@ -0,0 +1,109 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/* eslint-disable @eslint-react/exhaustive-deps, @eslint-react/no-nested-component-definitions, @eslint-react/static-components */
+// @ts-nocheck
+import './Schedule.scss';
+import classNames from 'classnames';
+import dateFormat from 'dateformat';
+import { observer } from 'mobx-react-lite';
+import { useEffect, useState } from 'react';
+import store from '../store';
+import { t } from '../utils/i18n';
+import sanitizeHTML from '../utils/sanitizeHtml';
+import { EventBadgeContainer } from './';
+import ShowMoreButton from './ShowMoreButtonContainer';
+function isCurrent(from, to) {
+    const now = new Date();
+    return from <= now && now <= to;
+}
+function isPast(endDate) {
+    const now = new Date();
+    return new Date(endDate) < now;
+}
+const Schedule = observer(({ events = [], descriptionMaxLength = 200, showBooths = false, isSessions = false, onEventClick, }) => {
+    const [eventsFullDescription, setEventsFullDescription] = useState({});
+    const now = new Date();
+    const upcomingEvents = events.filter((event) => {
+        const endDate = event.endDate ? new Date(event.endDate) : new Date(event.startDate);
+        return endDate > now;
+    });
+    const pastEvents = events.filter((event) => {
+        const endDate = event.endDate ? new Date(event.endDate) : new Date(event.startDate);
+        return endDate <= now;
+    });
+    const upcomingGrouped = upcomingEvents.reduce((acc, curr) => {
+        const [datePart] = curr.startDate.split('T');
+        acc[datePart] ? acc[datePart].push(curr) : (acc[datePart] = [curr]);
+        return acc;
+    }, {});
+    const pastGrouped = pastEvents.reduce((acc, curr) => {
+        const [datePart] = curr.startDate.split('T');
+        acc[datePart] ? acc[datePart].push(curr) : (acc[datePart] = [curr]);
+        return acc;
+    }, {});
+    useEffect(() => {
+        const initialState = {};
+        for (const date in upcomingGrouped) {
+            initialState[date] = upcomingGrouped[date].map(() => ({ showFullDescription: false }));
+        }
+        for (const date in pastGrouped) {
+            initialState[date] = pastGrouped[date].map(() => ({ showFullDescription: false }));
+        }
+        setEventsFullDescription(initialState);
+    }, [events.map((e) => e.id).join(',')]);
+    const toggleDescription = (e, date, index) => {
+        e.preventDefault();
+        e.stopPropagation();
+        setEventsFullDescription((prev) => {
+            const newState = { ...prev };
+            if (!Array.isArray(newState[date]))
+                newState[date] = [];
+            if (!newState[date][index])
+                newState[date][index] = { showFullDescription: false };
+            newState[date][index].showFullDescription = !newState[date][index].showFullDescription;
+            return newState;
+        });
+    };
+    const transformDescription = (desc, show) => desc.length > descriptionMaxLength && !show
+        ? desc.slice(0, descriptionMaxLength) + '...'
+        : desc;
+    const formatTime = (date) => {
+        const use24hFormat = store.sessionsFilterStore.state.filters.use24hFormat.value;
+        const d = new Date(date);
+        return dateFormat(d, use24hFormat ? 'HH:MM' : 'h:MMtt');
+    };
+    const formatDateDisplay = (dateStr) => {
+        const [year, month, day] = dateStr.split('-');
+        const date = new Date(parseInt(year), parseInt(month) - 1, parseInt(day));
+        return {
+            day: day,
+            month: dateFormat(date, 'mmm'),
+            weekday: dateFormat(date, 'ddd'),
+            full: dateFormat(date, 'dddd, mmmm d'),
+        };
+    };
+    const EventWrapper = ({ children, link, current, ended, event }) => {
+        const handleClick = (e) => {
+            if (onEventClick) {
+                e.preventDefault();
+                onEventClick(event);
+            }
+        };
+        return link ? (_jsx("a", { href: link, className: classNames('efp-schedule__event', current, ended), target: "_blank", rel: "noopener noreferrer", onClick: handleClick, children: children })) : (_jsx("div", { className: classNames('efp-schedule__event', { ended }), onClick: handleClick, children: children }));
+    };
+    const renderEventGroup = (groupedEvents, isPastEvents = false) => {
+        return Object.entries(groupedEvents).map(([date, events]) => {
+            const formattedDate = formatDateDisplay(date);
+            return (_jsxs("div", { className: "efp-schedule__item", children: [_jsx("div", { className: "efp-schedule__date", "aria-label": `Date: ${formattedDate.full}`, children: _jsxs("div", { className: "efp-schedule__date-sticky", children: [_jsx("div", { children: formattedDate.day }), _jsx("div", { children: formattedDate.month }), _jsx("div", { children: formattedDate.weekday })] }) }), _jsx("div", { className: "efp-schedule__events", role: "list", children: events.map((event, eventIndex) => {
+                            const booth = event.boothId
+                                ? store.boothStore.boothById.get(Number(event.boothId))
+                                : null;
+                            const showFull = eventsFullDescription[date]?.[eventIndex]?.showFullDescription ?? false;
+                            return (_jsx("div", { role: "listitem", "data-event-id": event.id, onClick: () => onEventClick?.(event), style: { cursor: onEventClick ? 'pointer' : 'default' }, children: _jsxs(EventWrapper, { link: "", ended: event.isEnded || isPast(event.endDate || event.startDate), current: isCurrent(event.startDate, event.endDate), event: event, children: [_jsxs("span", { children: [formatTime(event.startDate), event.endDate ? ` - ${formatTime(event.endDate)}` : null] }), _jsxs("strong", { children: [event.name, _jsx(EventBadgeContainer, { event: event })] }), _jsx("div", { className: "efp-schedule__event-booth-and-tracks", children: booth && showBooths && (_jsx("div", { className: "efp-schedule__event-booth", children: _jsx("div", { children: booth.name }) })) }), event.logoFile && (_jsx("div", { className: "efp-schedule__event-logo", children: _jsx("img", { src: event.logoFile, alt: event.name, crossOrigin: "anonymous" }) })), event.description && !isSessions && (_jsxs("div", { className: "efp-schedule__event-desc", children: [_jsx("div", { id: `event-desc-${date}-${eventIndex}`, dangerouslySetInnerHTML: {
+                                                        __html: sanitizeHTML(transformDescription(event.description, showFull)),
+                                                    } }), event.description.length > descriptionMaxLength && (_jsx(ShowMoreButton, { expanded: showFull, onClick: (e) => toggleDescription(e, date, eventIndex), "aria-controls": `event-desc-${date}-${eventIndex}` }))] }))] }) }, event.id));
+                        }) })] }, date));
+        });
+    };
+    return (_jsxs("div", { className: classNames('efp-schedule', { 'is-sessions': isSessions }), children: [renderEventGroup(upcomingGrouped), Object.keys(pastGrouped).length > 0 && (_jsxs(_Fragment, { children: [_jsx("div", { className: "efp-schedule__past-events-header", children: t('Past Sessions') }), renderEventGroup(pastGrouped, true)] }))] }));
+});
+export default Schedule;

package/dist/esm/components/ScrollableRowContainer.d.ts

@@ -0,0 +1,6 @@
+import { ScrollableRowProps } from '@expofp/ui';
+import React from 'react';
+type ScrollableRowContainerProps = Omit<ScrollableRowProps, 'leftAriaLabel' | 'rightAriaLabel' | 'isRtl'>;
+declare const ScrollableRowContainer: React.FunctionComponent<ScrollableRowContainerProps>;
+export default ScrollableRowContainer;
+//# sourceMappingURL=ScrollableRowContainer.d.ts.map

package/dist/esm/components/ScrollableRowContainer.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// @ts-nocheck
+/* eslint-disable @typescript-eslint/consistent-type-imports */
+import { ScrollableRow } from '@expofp/ui';
+import { observer } from 'mobx-react-lite';
+import { uiState } from '../store';
+import { t } from '../utils/i18n';
+const ScrollableRowContainer = observer((props) => {
+    return (_jsx(ScrollableRow, { ...props, isRtl: uiState.rtl, leftAriaLabel: t('Scroll left'), rightAriaLabel: t('Scroll right') }));
+});
+export default ScrollableRowContainer;

package/dist/esm/components/Search.d.ts

@@ -0,0 +1,5 @@
+import './Search.scss';
+import React from 'react';
+export default _default;
+declare function _default(): React.JSX.Element;
+//# sourceMappingURL=Search.d.ts.map

package/dist/esm/components/Search.js

@@ -0,0 +1,45 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/* eslint-disable @eslint-react/exhaustive-deps */
+// @ts-nocheck
+import './Search.scss';
+import { useLocalStore, useObserver } from 'mobx-react-lite';
+import { useCallback, useEffect, useRef } from 'react';
+import store, { uiState } from '../store';
+import EntityList from './EntityList';
+import { ShortcutsToolbar } from './Shortcuts';
+function Search() {
+    const scrollableRef = useRef();
+    const s = useLocalStore(() => ({
+        updateOverlayContent: null,
+        get text() {
+            if (uiState.list.type === 'search' || uiState.list.type === 'exhibitors') {
+                return uiState.list.text;
+            }
+            return '';
+        },
+        get showClose() {
+            return !!this.text;
+        },
+        get backMode() {
+            return this.text ? 'back' : 'menu';
+        },
+    }));
+    useEffect(() => {
+        store.fuzzySearchEngineStore.loadEngine();
+    }, []);
+    const updateContent = useCallback(() => {
+        if (s.updateOverlayContent)
+            s.updateOverlayContent();
+    }, [s.updateOverlayContent]);
+    return useObserver(() => {
+        return (_jsxs(_Fragment, { children: [_jsx(ShortcutsToolbar, { interfaceId: "search", showFiltersButton: false }), _jsx(EntityList, { updateScroll: updateContent, updatedScrollableRef: scrollableRef })] }));
+    });
+}
+export default () => useObserver(() => (_jsxs(_Fragment, { children: [!uiState.details && !uiState.menu && uiState.list.type === 'exhibitors' ? _jsx(Search, {}) : null, !uiState.details &&
+            !uiState.menu &&
+            uiState.list.type === 'search' &&
+            (store.fp.alwaysShowSidebar ||
+                uiState.heatmap ||
+                uiState.searchFocused ||
+                uiState.list.text.length > 0 ||
+                uiState.searchClearMode) ? (_jsx(Search, {})) : null] })));

package/dist/esm/components/SearchBox.d.ts

@@ -0,0 +1,7 @@
+import './SearchBox.scss';
+interface SearchBoxProps {
+    className?: string;
+}
+declare function SearchBox({ className }: SearchBoxProps): import("react").JSX.Element;
+export default SearchBox;
+//# sourceMappingURL=SearchBox.d.ts.map

package/dist/esm/components/SearchBox.js

@@ -0,0 +1,171 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import './SearchBox.scss';
+import classNames from 'classnames';
+import { useObserver } from 'mobx-react-lite';
+import { useEffect, useMemo, useRef, useState } from 'react';
+import store, { searchStore, uiState } from '../store';
+import debounce from '../tools/debounce';
+import { GaEventActions, sendEventToGa } from '../tools/gtag';
+import { handleCustomCommand } from '../utils/customCommands';
+import { t } from '../utils/i18n';
+import { useAutorun } from '../utils/mobx';
+import { Badge } from './';
+const DEBOUNCE_DELAY_MS = 1000;
+/**
+ * Whether the input holds focus. Read through the input's own root: the SDK renders into a shadow
+ * root, where `document.activeElement` only ever names the host element, never the input.
+ */
+function hasFocus(input) {
+    const root = input.getRootNode();
+    return root.activeElement === input;
+}
+function SearchBox({ className }) {
+    const rootRef = useRef(null);
+    const inputRef = useRef(null);
+    function handleKeydown(e) {
+        let delta = 0;
+        switch (e.key) {
+            case 'Down':
+            case 'ArrowDown':
+                delta = 1;
+                break;
+            case 'Up':
+            case 'ArrowUp':
+                delta = -1;
+                break;
+            case 'Enter': {
+                e.preventDefault();
+                store.openActiveListItem();
+                const input = inputRef.current;
+                if (input) {
+                    handleCustomCommand(input.value);
+                }
+                return;
+            }
+            case 'Escape':
+                e.preventDefault();
+                searchStore.closeSearch();
+                return;
+        }
+        if (delta) {
+            e.preventDefault();
+            store.changeActiveListIndex(delta);
+        }
+    }
+    const [animatedPlaceholder, setAnimatedPlaceholder] = useState('');
+    const [isIdleMode, setIsIdleMode] = useState(false);
+    useAutorun(() => {
+        setIsIdleMode(uiState.kiosk && uiState.inIdle);
+    });
+    // The typed-out placeholder of an idle kiosk. Only shown while idle, so the text it leaves
+    // behind when idle mode ends needs no reset: the next idle period starts typing from the first
+    // character again. The first keystroke is scheduled like the rest rather than typed in the
+    // effect body, which would set state synchronously inside the effect.
+    useEffect(() => {
+        if (!isIdleMode)
+            return;
+        const phrases = [
+            t('Find Companies...'),
+            t('Find Categories...'),
+            t('Find Sessions...'),
+            t('Search...'),
+        ];
+        let currentPhraseIndex = 0;
+        let currentCharIndex = 0;
+        let isDeleting = false;
+        let timeoutId;
+        const type = () => {
+            const currentPhrase = phrases[currentPhraseIndex];
+            if (isDeleting) {
+                setAnimatedPlaceholder(currentPhrase.substring(0, currentCharIndex - 1));
+                currentCharIndex--;
+            }
+            else {
+                setAnimatedPlaceholder(currentPhrase.substring(0, currentCharIndex + 1));
+                currentCharIndex++;
+            }
+            let typingSpeed = isDeleting ? 50 : 100;
+            if (!isDeleting && currentCharIndex === currentPhrase.length) {
+                isDeleting = true;
+                typingSpeed = 2000;
+            }
+            else if (isDeleting && currentCharIndex === 0) {
+                isDeleting = false;
+                currentPhraseIndex = (currentPhraseIndex + 1) % phrases.length;
+                typingSpeed = 500;
+            }
+            timeoutId = setTimeout(type, typingSpeed);
+        };
+        timeoutId = setTimeout(type, 0);
+        return () => clearTimeout(timeoutId);
+    }, [isIdleMode]);
+    // The store closing the search (Escape, the close button, a shortcut toggled off) takes DOM
+    // focus off the input as well. The list reopens on the input's `focus` event, and an input that
+    // kept focus fires none on the next click — that click then did nothing. This used to run only
+    // while the sheet was not at full size, which on a desktop is never.
+    useAutorun(() => {
+        const input = inputRef.current;
+        if (input && !searchStore.isFocused && hasFocus(input)) {
+            input.blur();
+        }
+    });
+    useAutorun(() => {
+        if (uiState.menu && uiState.kiosk) {
+            searchStore.setFocused(false);
+        }
+    });
+    useAutorun(() => {
+        const input = inputRef.current;
+        if (input && searchStore.isFocused && !searchStore.skipInputFocus && !hasFocus(input)) {
+            input.focus();
+        }
+    });
+    useEffect(() => {
+        store.fuzzySearchEngineStore.loadEngine();
+    }, []);
+    const debouncedChange = useMemo(() => debounce(() => {
+        if (searchStore.searchText) {
+            sendEventToGa(GaEventActions.Search, searchStore.searchText);
+        }
+        window.__resett?.();
+    }, DEBOUNCE_DELAY_MS), []);
+    function handleChange() {
+        searchStore.setSearchText(inputRef.current?.value || '');
+        debouncedChange();
+    }
+    function handleFocus() {
+        searchStore.setFocused(true);
+        window.__resett?.();
+    }
+    function handleSearchClick() {
+        if (searchStore.isFocused) {
+            return;
+        }
+        searchStore.handleSearchAction();
+        setTimeout(() => {
+            inputRef.current?.focus();
+        }, 100);
+    }
+    function handleBackClick() {
+        searchStore.handleBackAction();
+    }
+    function handleCloseClick() {
+        searchStore.closeSearch();
+    }
+    return useObserver(() => (_jsxs("div", { className: classNames('search-box', className, searchStore.searchBoxClass, {
+            'efp-semi-transparent': uiState.setKioskModeEnabled,
+        }), "data-interface": uiState.activeInterfaceId, ref: rootRef, children: [_jsx("button", { className: classNames('search-box__button', 'search-box__button--back', {
+                    'is-mobile-details': searchStore.isMobileDetailsMode,
+                    'search-box__button--home': searchStore.backMode !== 'back' && uiState.viewerMode,
+                }), onClick: handleBackClick, type: "button", "aria-label": searchStore.backMode === 'back' ? t('Go back') : t('Main menu'), children: _jsx("i", { className: searchStore.backMode === 'back'
+                        ? 'icon-chevron-left'
+                        : uiState.viewerMode
+                            ? 'icon-home-solid'
+                            : 'icon-menu' }) }), _jsx("div", { className: "search-box__input-wrapper", children: searchStore.shouldShowSearchInput ? (_jsx("input", { ref: inputRef, type: "search", className: "search-box__input", placeholder: isIdleMode ? animatedPlaceholder : searchStore.placeholder, "aria-label": "Search", value: searchStore.searchText, onChange: handleChange, onKeyDown: handleKeydown, onFocus: handleFocus, autoComplete: "off", autoCorrect: "off", autoCapitalize: "off", spellCheck: false, disabled: uiState.setKioskModeEnabled })) : (_jsxs("div", { className: "search-box__title", children: [searchStore.searchBoxIcon && (_jsx("i", { className: classNames('search-box__title-icon', searchStore.searchBoxIcon) })), _jsxs("div", { className: "search-box__title-content", children: [_jsx("strong", { className: "search-box__title-text", children: searchStore.searchBoxTitle }), searchStore.searchBoxSubtitle && (_jsx("span", { className: "search-box__title-subtitle", children: searchStore.searchBoxSubtitle }))] }), searchStore.searchBoxBadge ? (_jsx(Badge, { variant: "lightgray", size: "md", rounded: true, noMargins: true, children: searchStore.searchBoxBadge })) : null] })) }), !searchStore.shouldShowSearchInput &&
+                searchStore.searchBoxActions.map((action) => (_jsx("button", { className: "search-box__button search-box__button--ui-action", onClick: action.handler, type: "button", "aria-label": action.label, title: action.label, children: _jsx("i", { className: action.icon }) }, action.id))), _jsx("button", { className: "search-box__button search-box__button--action", onClick: searchStore.shouldShowSearchInput
+                    ? searchStore.shouldShowCloseButton
+                        ? handleCloseClick
+                        : handleSearchClick
+                    : handleCloseClick, type: "button", "aria-label": searchStore.ariaLabel, children: _jsx("i", { className: searchStore.actionButtonIcon }) })] })));
+}
+export default SearchBox;

package/dist/esm/components/SearchButtons/SearchButton.d.ts

@@ -0,0 +1,20 @@
+import './SearchButton.scss';
+import React from 'react';
+export interface SearchButtonProps {
+    id: string;
+    label: string;
+    icon?: string;
+    text?: string;
+    active: boolean;
+    count?: number;
+    variant?: 'toggle' | 'action';
+    isDimmed?: boolean;
+    isDisabled?: boolean;
+    showZeroCount?: boolean;
+    backgroundColor?: string;
+    textColor?: string;
+    onClick: () => void;
+}
+declare const SearchButton: React.FC<SearchButtonProps>;
+export default SearchButton;
+//# sourceMappingURL=SearchButton.d.ts.map

package/dist/esm/components/SearchButtons/SearchButton.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import './SearchButton.scss';
+import cn from 'classnames';
+import { observer } from 'mobx-react-lite';
+const SearchButton = observer(({ id, label, icon, text, active, count, variant = 'toggle', isDimmed = false, isDisabled = false, showZeroCount = false, backgroundColor, textColor, onClick, }) => {
+    const shouldShowCount = count !== undefined && (count > 0 || showZeroCount);
+    const hasCustomColor = !!backgroundColor;
+    const customStyle = hasCustomColor
+        ? {
+            '--btn-bg-color': backgroundColor,
+            '--btn-text-color': textColor || '#1a1a1a',
+        }
+        : undefined;
+    return (_jsxs("button", { type: "button", style: customStyle, className: cn('efp-search-button', `efp-search-button--${variant}`, {
+            'is-active': active,
+            'is-dimmed': isDimmed,
+            'is-disabled': isDisabled,
+            'has-custom-color': hasCustomColor,
+        }), onClick: () => {
+            // Presentational only — the `sbtnview` stat is reported by the click
+            // handlers in `SearchButtonsActions`, which know whether the click
+            // switched the button on or off. `active` here is a display flag and
+            // does not answer that for every button.
+            onClick?.();
+            window['__resett']?.();
+        }, disabled: isDisabled, "aria-label": label, title: label, children: [icon && _jsx("i", { className: icon }), text && _jsx("span", { className: "efp-search-button__text", children: text }), shouldShowCount && (_jsx("span", { className: cn('efp-search-button__count', {
+                    'is-zero': count === 0,
+                }), children: count }))] }));
+});
+export default SearchButton;

package/dist/esm/components/SearchButtons/SearchButtons.d.ts

@@ -0,0 +1,4 @@
+import './SearchButtons.scss';
+declare const SearchButtons: import("react").FunctionComponent<object>;
+export default SearchButtons;
+//# sourceMappingURL=SearchButtons.d.ts.map

package/dist/esm/components/SearchButtons/SearchButtons.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import './SearchButtons.scss';
+import cn from 'classnames';
+import { observer } from 'mobx-react-lite';
+import { useMemo } from 'react';
+import appData from '../../data';
+import store from '../../store';
+import { t } from '../../utils/i18n';
+import ScrollableRow from '../ScrollableRowContainer';
+import SearchButton from './SearchButton';
+import SearchSubButtons from './SearchSubButtons';
+const SearchButtons = observer(() => {
+    const { searchButtonsStore } = store;
+    const enabledButtons = useMemo(() => searchButtonsStore.searchButtons.filter((searchButton) => searchButton.enabled), [searchButtonsStore.searchButtons]);
+    if (!searchButtonsStore.shouldShow)
+        return null;
+    return (_jsxs("div", { className: cn('efp-search-buttons', {
+            'is-overlay-full': store.uiState.isOverlayOpen && store.uiState.overlaySize === 'full',
+            // Room for the floor dropdown, or for the venue picker sized like it.
+            'is-long-levels': !appData.shortLevelName || store.venueStore.isCampusMode,
+            'is-standalone': store.uiState.overlayOnDemand && !store.uiState.isOverlayOpen,
+            'efp-semi-transparent': store.uiState.setKioskModeEnabled,
+        }), children: [_jsx(ScrollableRow, { ariaLabel: t('Search filters'), scrollAmount: 150, showArrowsOnMobile: false, arrowPosition: "inside", children: enabledButtons.map((searchButton) => (_jsx(SearchButton, { ...searchButton, isDisabled: store.uiState.setKioskModeEnabled }, searchButton.id))) }), searchButtonsStore.subButtonsEnabled && _jsx(SearchSubButtons, {})] }));
+});
+export default SearchButtons;

package/dist/esm/components/SearchButtons/SearchSubButton.d.ts

@@ -0,0 +1,14 @@
+import './SearchSubButton.scss';
+import React from 'react';
+export interface SearchSubButtonProps {
+    id: string;
+    label: string;
+    icon?: string;
+    text?: string;
+    active: boolean;
+    count?: number;
+    onClick: () => void;
+}
+declare const SearchSubButton: React.FC<SearchSubButtonProps>;
+export default SearchSubButton;
+//# sourceMappingURL=SearchSubButton.d.ts.map

package/dist/esm/components/SearchButtons/SearchSubButton.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import './SearchSubButton.scss';
+import cn from 'classnames';
+import { observer } from 'mobx-react-lite';
+import { memo } from 'react';
+const SearchSubButton = memo(observer(({ id, label, icon, text, active, count, onClick }) => {
+    return (_jsxs("button", { type: "button", className: cn('efp-search-sub-button', {
+            'is-active': active,
+        }), onClick: onClick, "aria-label": label, title: label, children: [icon ? (_jsx("i", { className: icon })) : text ? (_jsx("span", { className: "efp-search-sub-button__text", children: text })) : null, count !== undefined && count > 0 && (_jsx("span", { className: "efp-search-sub-button__count", children: count }))] }));
+}));
+SearchSubButton.displayName = 'SearchSubButton';
+export default SearchSubButton;

package/dist/esm/components/SearchButtons/SearchSubButtons.d.ts

@@ -0,0 +1,5 @@
+import './SearchSubButtons.scss';
+import React from 'react';
+declare const SearchSubButtons: React.FC;
+export default SearchSubButtons;
+//# sourceMappingURL=SearchSubButtons.d.ts.map

package/dist/esm/components/SearchButtons/SearchSubButtons.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/* eslint-disable @eslint-react/exhaustive-deps, @eslint-react/rules-of-hooks */
+// @ts-nocheck
+import './SearchSubButtons.scss';
+import cn from 'classnames';
+import { observer } from 'mobx-react-lite';
+import { memo, useEffect, useMemo, useRef } from 'react';
+import store from '../../store';
+import SearchSubButton from './SearchSubButton';
+const SearchSubButtons = memo(observer(() => {
+    const { searchButtonsStore } = store;
+    const containerRef = useRef(null);
+    // useEffect(() => {
+    //     const handleClickOutside = (event: MouseEvent) => {
+    //         if (containerRef.current && !containerRef.current.contains(event.target as Node)) {
+    //             searchButtonsStore.hideSubButtons();
+    //         }
+    //     };
+    //     if (searchButtonsStore.shouldShowSubButtons) {
+    //         document.addEventListener("mousedown", handleClickOutside);
+    //         return () => document.removeEventListener("mousedown", handleClickOutside);
+    //     }
+    // }, [searchButtonsStore.shouldShowSubButtons]);
+    useEffect(() => {
+        const handleEscape = (event) => {
+            if (event.key === 'Escape' && searchButtonsStore.shouldShowSubButtons) {
+                searchButtonsStore.hideSubButtons();
+            }
+        };
+        if (searchButtonsStore.shouldShowSubButtons) {
+            document.addEventListener('keydown', handleEscape);
+            return () => document.removeEventListener('keydown', handleEscape);
+        }
+    }, [searchButtonsStore.shouldShowSubButtons]);
+    const subButtons = useMemo(() => searchButtonsStore.activeSubButtons, [searchButtonsStore.activeSubButtons]);
+    if (!searchButtonsStore.shouldShowSubButtons)
+        return null;
+    return (_jsx("div", { ref: containerRef, className: cn('efp-search-sub-buttons', {
+            'is-visible': searchButtonsStore.shouldShowSubButtons,
+        }), children: _jsx("div", { className: "efp-search-sub-buttons__container", children: subButtons.map((subButton) => (_jsx(SearchSubButton, { ...subButton }, subButton.id))) }) }));
+}));
+SearchSubButtons.displayName = 'SearchSubButtons';
+export default SearchSubButtons;

package/dist/esm/components/SearchButtons/index.d.ts

@@ -0,0 +1,7 @@
+export { default as SearchButtons } from './SearchButtons';
+export { default as SearchButton } from './SearchButton';
+export { default as SearchSubButtons } from './SearchSubButtons';
+export { default as SearchSubButton } from './SearchSubButton';
+export type { SearchButtonProps } from './SearchButton';
+export type { SearchSubButtonProps } from './SearchSubButton';
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/components/SearchButtons/index.js

@@ -0,0 +1,5 @@
+/* eslint-disable simple-import-sort/exports */
+export { default as SearchButtons } from './SearchButtons';
+export { default as SearchButton } from './SearchButton';
+export { default as SearchSubButtons } from './SearchSubButtons';
+export { default as SearchSubButton } from './SearchSubButton';

package/dist/esm/components/Sessions.d.ts

@@ -0,0 +1,8 @@
+import './Sessions.scss';
+import React from 'react';
+export interface SessionsProps {
+    showFilters?: boolean;
+}
+declare const SessionsWrapper: React.FC<SessionsProps>;
+export default SessionsWrapper;
+//# sourceMappingURL=Sessions.d.ts.map