@mappedin/viewer 0.36.1-c3a0ce0.0 → 0.36.1-e3d997b.0

package/dist/types/src/components/card-item/index.d.ts

@@ -5,6 +5,7 @@ type TCardItemProps = {
     tabIndex?: number;
     role?: string;
     onClickOrPress?: () => void;
+    clickableStyling?: number;
 };
 declare const CardItem: React.FC<PropsWithChildren<TCardItemProps>>;
 export default CardItem;

package/dist/types/src/components/carousel/index.d.ts

@@ -6,6 +6,7 @@ type TCarouselProps = {
     width?: number | string;
     height?: number | string;
     navChevronOffsetY?: number;
+    hideNavChevrons?: boolean;
 };
 declare const Carousel: React.FC<PropsWithChildren<TCarouselProps>>;
 export default Carousel;

package/dist/types/src/components/categories-view/categories-view.stories.d.ts

@@ -1,4 +1,23 @@
 import { Story } from '@ladle/react';
+export declare const EXAMPLE_CATEGORIES: ({
+    id: string;
+    name: string;
+    icon: string;
+    results: {
+        label: string;
+        ids: string[];
+    }[];
+    parent?: undefined;
+} | {
+    id: string;
+    name: string;
+    icon: string;
+    parent: string;
+    results: {
+        label: string;
+        ids: string[];
+    }[];
+})[];
 export declare const Item: Story;
 export declare const Content: Story;
 export declare const Default: Story;

package/dist/types/src/components/categories-view/categories.d.ts

@@ -5,6 +5,9 @@ type TCategoriesProps = {
     onCategoryClick?: (categoryId: string) => void;
     onResultClick?: (ids: string[]) => void;
     onBackClick?: () => void;
+    onStateChangeEnd?: () => void;
+    visible?: boolean;
+    maxHeight?: number;
 };
 declare const Categories: import("react").ForwardRefExoticComponent<TCategoriesProps & import("react").RefAttributes<HTMLDivElement>>;
 export default Categories;

package/dist/types/src/components/categories-view/utils.d.ts

@@ -3,6 +3,7 @@ export declare const CATEGORY_CARD_TOP_BOTTOM_PADDING = 8;
 export declare const CATEGORY_ITEM_HEIGHT = 40;
 export declare const MAX_CATEGORIES_DESKTOP: 6.5;
 export declare const MAX_CATEGORIES_MOBILE: 4.5;
+export declare const ALL_CATEGORIES_WIDTH_DESKTOP_PX: 400;
 export declare const useActiveCategory: (categories: TCategory[], activeCategoryId: string | undefined) => {
     activeCategory: TCategory | undefined;
     rootCategories: TCategory[];

package/dist/types/src/components/category-icon/category-icon.stories.d.ts

@@ -1,2 +1,3 @@
 import { Story } from '@ladle/react';
 export declare const Default: Story;
+export declare const FromUrl: Story;

package/dist/types/src/components/collapsible/index.d.ts

@@ -1,4 +1,3 @@
-import { PropsWithChildren } from 'react';
 type TCollapsibleProps = {
     /**
      * Whether the content should be collapsible. If false, the full content will always be shown.
@@ -14,7 +13,13 @@ type TCollapsibleProps = {
      * expand to its natural height.
      */
     maxHeight?: number | string;
+    /**
+     * The content to render. If a function is provided, it will be called with the collapsed state.
+     */
+    children: React.ReactNode | ((props: {
+        collapsed: boolean;
+    }) => React.ReactNode);
     style?: React.CSSProperties;
 };
-declare const Collapsible: React.FC<PropsWithChildren<TCollapsibleProps>>;
+declare const Collapsible: React.FC<TCollapsibleProps>;
 export default Collapsible;

package/dist/types/src/components/legacy-metadata-card/utils.d.ts

@@ -1,6 +1,8 @@
 import ReactDOM from 'react-dom/client';
 import { TMetadataCardProps } from './card';
 /**
+ * @deprecated Use {@link showViewerCard} instead.
+ *
  * Imperative API to render the metadata card into a provided container element.
  */
 export declare const showMetadataCard: (container: Element, props: TMetadataCardProps) => ReactDOM.Root;

package/dist/types/src/components/link-item/index.d.ts

@@ -10,6 +10,11 @@ type TLinkItemProps = (TLinkItemWithURLProps | TLinkItemWithPhoneNumberProps) &
      * Optionally override the icon. Defaults to `link-2-16x16`.
      */
     icon?: string;
+    /**
+     * Callback function that is called when the link is clicked. The component should already handle
+     * opening the link. This can be used for side effects like analytics.
+     */
+    onClick?: () => void;
 };
 declare const LinkItem: React.FC<TLinkItemProps>;
 export default LinkItem;

package/dist/types/src/components/main/index.d.ts

@@ -1,34 +1,3 @@
-import { ComponentProps } from 'react';
-import { TCategory, TSearchResult } from '../../lib/types/search';
-import Directions from '../directions';
-import SearchBar from '../search-bar';
-import { TOnClickOrPressPayload } from '../button';
-type TMainUIProps = {
-    onBlur?: () => void;
-    query?: string;
-    onQueryChange?: (query: string) => void;
-    searchResults: TSearchResult[];
-    resultsLoading: boolean;
-    isMakerPreview?: boolean;
-    categories: TCategory[];
-    onResultSelected?: (ids: string[], context: 'category' | 'search-result') => void;
-    onSearchBarFocus?: ComponentProps<typeof SearchBar>['onFocus'];
-    onSearchBarBlur?: ComponentProps<typeof SearchBar>['onBlur'];
-    maxHeight?: number;
-    departureMode?: ComponentProps<typeof Directions>['departureMode'];
-    departureModes?: ComponentProps<typeof Directions>['departureModes'];
-    onDepartureModeChange?: ComponentProps<typeof Directions>['onDepartureModeChange'];
-    departureQuery?: ComponentProps<typeof Directions>['departureQuery'];
-    onDepartureQueryChange?: ComponentProps<typeof Directions>['onDepartureQueryChange'];
-    onDepartureResultSelected?: ComponentProps<typeof Directions>['onDepartureResultSelected'];
-    onDepartureModeResetClick?: ComponentProps<typeof Directions>['onDepartureModeResetClick'];
-    departureSearchResults?: ComponentProps<typeof Directions>['departureSearchResults'];
-    directionsVisible?: boolean;
-    directionsWarningTranslationKey?: string;
-    directionsButtonVisible?: boolean;
-    directionsButtonDisabled?: boolean;
-    onDirectionsButtonClick?: (e: TOnClickOrPressPayload) => void;
-    onSwapDirectionsClick?: () => void;
-};
+import { TMainUIProps } from './utils';
 declare const MainUI: React.FC<TMainUIProps>;
 export default MainUI;

package/dist/types/src/components/main/utils.d.ts

@@ -1 +1,39 @@
+import { ComponentProps } from 'react';
+import { TSearchResult, TCategory } from '../../lib/types/search';
+import { TOnClickOrPressPayload } from '../button';
+import SearchBar from '../search-bar';
+import Directions from '../directions';
+type TOnResultSelected = (ids: string[], context: 'category' | 'search-result') => void;
+type TSearchUIProps = {
+    query?: string;
+    onQueryChange?: (query: string) => void;
+    searchResults: TSearchResult[];
+    resultsLoading: boolean;
+    onResultSelected?: TOnResultSelected;
+    onSearchBarFocus?: ComponentProps<typeof SearchBar>['onFocus'];
+    onSearchBarBlur?: ComponentProps<typeof SearchBar>['onBlur'];
+};
+type TDirectionsUIProps = Partial<Pick<ComponentProps<typeof Directions>, 'departureMode' | 'departureModes' | 'onDepartureModeChange' | 'departureQuery' | 'departureSearchResults' | 'onDepartureQueryChange' | 'onDepartureResultSelected' | 'onDepartureModeResetClick'>> & {
+    onSwapDirectionsClick?: () => void;
+    directionsWarningTranslationKey?: string;
+};
+type TCategoryUIProps = {
+    categories: TCategory[];
+    activeCategoryId?: string;
+    onCategorySelected?: (id: string) => void;
+    onResultSelected?: TOnResultSelected;
+    onBackClick?: () => void;
+};
+type TSelectedPlaceUIProps = {
+    directionsButtonVisible?: boolean;
+    directionsButtonDisabled?: boolean;
+    onDirectionsButtonClick?: (e: TOnClickOrPressPayload) => void;
+};
+export type TMainUIProps = TDirectionsUIProps & TSearchUIProps & TCategoryUIProps & TSelectedPlaceUIProps & {
+    onBlur?: () => void;
+    isMakerPreview?: boolean;
+    maxHeight?: number;
+    directionsVisible?: boolean;
+};
 export declare const MAIN_UI_DEFAULT_WIDTH_DESKTOP = 320;
+export {};

package/dist/types/src/components/metadata-card/utils.d.ts

@@ -2,6 +2,7 @@ import { ComponentProps } from 'react';
 import { TOnClickOrPressPayload } from '../button';
 import SocialsItem from '../socials-item';
 import OpeningHours from '../../lib/time/opening-hours';
+import ReactDOM from 'react-dom/client';
 export declare const METADATA_CARD_WIDTH = 320;
 export declare const METADATA_CARD_PADDING = 20;
 export declare const HERO_IMAGE_HEIGHT = 200;
@@ -83,6 +84,10 @@ export type TMetadataCardProps = {
      * Callback when the location link is clicked to copy a deep link to the location.
      */
     onCopyLocationLink?: () => void;
+    /**
+     * Callback when a category is clicked.
+     */
+    onCategoryClick?: (category: string) => void;
     /**
      * Optionally disable the directions button.
      */
@@ -102,3 +107,12 @@ export declare const useMetadataCard: (options: TMetadataCardProps) => {
         name: string;
     }[]) | null;
 };
+/**
+ * Imperative API to render the viewer's metadata card into a provided container element.
+ */
+export declare const showViewerCard: (container: Element, props: TMetadataCardProps) => ReactDOM.Root;
+/**
+ * A React component that renders the viewer's metadata card with a theme provider so it can
+ * be used externally.
+ */
+export declare const ViewerCard: React.FC<TMetadataCardProps>;

package/dist/types/src/index.d.ts

@@ -9,6 +9,7 @@ declare const start: (options: TStartViewerOptions) => void;
 declare const startWithLocalData: (options: TStartViewerWithLocalDataOptions) => void;
 export { default as MetadataCard } from './components/legacy-metadata-card/card';
 export { showMetadataCard } from './components/legacy-metadata-card/utils';
+export { ViewerCard, showViewerCard } from './components/metadata-card/utils';
 export * from './lib/utils/image-utils';
 export { startWithLocalData };
 export default start;

package/dist/types/src/lib/hooks/use-cached-value.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Returns the latest defined value passed to the hook.
+ */
+declare const useCachedValue: <T>(value: T) => T | undefined;
+export default useCachedValue;

package/dist/types/src/lib/hooks/use-cached-value.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/src/lib/hooks/use-focus.d.ts

@@ -7,6 +7,7 @@ declare const useFocus: <T extends HTMLElement>(ref: React.RefObject<T>, options
     onFocus?: () => void;
     onKeyboardFocus?: () => void;
     onBlur?: () => void;
+    debug?: boolean;
 }>) => {
     isFocused: boolean;
 };

package/dist/types/src/lib/sdk/types.d.ts

@@ -1,6 +1,6 @@
-import { Space, MapObject, PointOfInterest, Connection, Annotation, Coordinate, Door, CameraTransform as _CameraTransform, TEventPayload as _TEventPayload, TEvents, Area } from './mappedin-js';
-export declare const PLACE_TYPES: (typeof Space | typeof PointOfInterest | typeof Connection | typeof MapObject | typeof Door | typeof Coordinate | typeof Annotation | typeof Area)[];
-export declare const PLACE_TYPE_STRINGS: ("area" | "space" | "point-of-interest" | "connection" | "object" | "door" | "coordinate" | "annotation")[];
+import { Space, MapObject, PointOfInterest, Connection, Annotation, Coordinate, Door, CameraTransform as _CameraTransform, TEventPayload as _TEventPayload, TEvents, Area, LocationProfile } from './mappedin-js';
+export declare const PLACE_TYPES: (typeof Space | typeof PointOfInterest | typeof Connection | typeof MapObject | typeof Door | typeof Coordinate | typeof Annotation | typeof Area | typeof LocationProfile)[];
+export declare const PLACE_TYPE_STRINGS: ("location-profile" | "space" | "point-of-interest" | "connection" | "object" | "door" | "coordinate" | "annotation" | "area")[];
 export type PlaceTypeString = (typeof PLACE_TYPE_STRINGS)[number];
 export type PlaceType = (typeof PLACE_TYPES)[number];
 export type Place = InstanceType<PlaceType>;

package/dist/types/src/lib/time/utils.d.ts

@@ -32,3 +32,10 @@ export declare function singleDayOpeningHoursTimes(hours: null): null;
 export declare function singleDayOpeningHoursTimes(hours: [TTimeRange]): [Time, Time];
 export declare function singleDayOpeningHoursTimes(hours: [TTimeRange, TTimeRange]): [Time, Time, Time, Time];
 export declare function singleDayOpeningHoursTimes(hours: TSingleDayOpeningHours): [Time, Time] | [Time, Time, Time, Time] | null;
+/**
+ * Parse a time string in the format of 'HH:MM' into hours and minutes.
+ */
+export declare const parseTimeString: (time: string) => {
+    hours: number;
+    minutes: number;
+};

package/dist/types/src/lib/utils/data-utils.d.ts

@@ -1,4 +1,5 @@
-import { Annotation, Connection, Place, Space, Coordinate, TNavigationTarget, Floor } from '../sdk';
+import { Annotation, Connection, Place, Space, Coordinate, TNavigationTarget, Floor, LocationProfile } from '../sdk';
+import OpeningHours from '../time/opening-hours';
 /**
  * Whether the location can be assumed to be a washroom
  */
@@ -15,6 +16,7 @@ export declare const hasName: (place: Place) => boolean;
  * Whether the location has any metadata other than name
  */
 export declare const hasMetaData: (place: Place) => boolean;
+export declare const hasLocationProfiles: (place: Place) => boolean;
 /**
  * Whether the location has a name or any other metadata
  */
@@ -57,6 +59,7 @@ export declare const getCameraTargetsForPlaces: (places: Floor | Place | Place[]
     readonly floor: Floor;
     readonly coordinate: Coordinate;
     readonly externalId: string;
+    readonly locationProfiles: LocationProfile[];
     readonly geoJSON: {
         properties: null;
         type: import("@mappedin/mvf").FeatureType;
@@ -72,9 +75,11 @@ export declare const getCameraTargetsForPlaces: (places: Floor | Place | Place[]
             latitude: number;
             longitude: number;
             floor: string | undefined;
+            verticalOffset: number;
         };
     };
     destroy(): void;
+    "__#57@#private": any;
     readonly id: string;
     links: {
         "__#22@#private": any;
@@ -101,6 +106,7 @@ export declare const getCameraTargetsForPlaces: (places: Floor | Place | Place[]
         destroy(): void;
         readonly id: string;
     }[];
+    readonly geoJSONBoundingBox: {};
 } | Connection | import("@mappedin/mappedin-js/mappedin-js/src/map-data-objects/object").MapObject | {
     "__#15@#private": any;
     readonly __type: "door";
@@ -110,6 +116,7 @@ export declare const getCameraTargetsForPlaces: (places: Floor | Place | Place[]
     readonly floor: Floor;
     readonly center: Coordinate;
     readonly isExterior: boolean;
+    readonly locationProfiles: LocationProfile[];
     readonly geoJSON: {
         properties: null;
         type: import("@mappedin/mvf").FeatureType;
@@ -125,9 +132,11 @@ export declare const getCameraTargetsForPlaces: (places: Floor | Place | Place[]
             latitude: number;
             longitude: number;
             floor: string | undefined;
+            verticalOffset: number;
         };
     };
     destroy(): void;
+    "__#57@#private": any;
     readonly id: string;
     links: {
         "__#22@#private": any;
@@ -154,7 +163,8 @@ export declare const getCameraTargetsForPlaces: (places: Floor | Place | Place[]
         destroy(): void;
         readonly id: string;
     }[];
-} | Coordinate | Annotation | Floor | (Space | {
+    readonly geoJSONBoundingBox: {};
+} | Coordinate | Annotation | LocationProfile | Floor | (Space | {
     "__#20@#private": any;
     readonly __type: "point-of-interest";
     readonly name: string;
@@ -162,6 +172,7 @@ export declare const getCameraTargetsForPlaces: (places: Floor | Place | Place[]
     readonly floor: Floor;
     readonly coordinate: Coordinate;
     readonly externalId: string;
+    readonly locationProfiles: LocationProfile[];
     readonly geoJSON: {
         properties: null;
         type: import("@mappedin/mvf").FeatureType;
@@ -177,9 +188,11 @@ export declare const getCameraTargetsForPlaces: (places: Floor | Place | Place[]
             latitude: number;
             longitude: number;
             floor: string | undefined;
+            verticalOffset: number;
         };
     };
     destroy(): void;
+    "__#57@#private": any;
     readonly id: string;
     links: {
         "__#22@#private": any;
@@ -206,6 +219,7 @@ export declare const getCameraTargetsForPlaces: (places: Floor | Place | Place[]
         destroy(): void;
         readonly id: string;
     }[];
+    readonly geoJSONBoundingBox: {};
 } | Connection | import("@mappedin/mappedin-js/mappedin-js/src/map-data-objects/object").MapObject | {
     "__#15@#private": any;
     readonly __type: "door";
@@ -215,6 +229,7 @@ export declare const getCameraTargetsForPlaces: (places: Floor | Place | Place[]
     readonly floor: Floor;
     readonly center: Coordinate;
     readonly isExterior: boolean;
+    readonly locationProfiles: LocationProfile[];
     readonly geoJSON: {
         properties: null;
         type: import("@mappedin/mvf").FeatureType;
@@ -230,9 +245,11 @@ export declare const getCameraTargetsForPlaces: (places: Floor | Place | Place[]
             latitude: number;
             longitude: number;
             floor: string | undefined;
+            verticalOffset: number;
         };
     };
     destroy(): void;
+    "__#57@#private": any;
     readonly id: string;
     links: {
         "__#22@#private": any;
@@ -259,10 +276,16 @@ export declare const getCameraTargetsForPlaces: (places: Floor | Place | Place[]
         destroy(): void;
         readonly id: string;
     }[];
-} | Coordinate | Annotation)[];
+    readonly geoJSONBoundingBox: {};
+} | Coordinate | Annotation | LocationProfile)[];
 export declare const getSearchIdForPlace: (place: Place) => string | undefined;
-export declare const getCategoryIdForPlace: (place: Place) => string;
+export declare const getFloors: (place: Exclude<Place, Coordinate>) => Floor[];
+export declare const getPlacesForLocation: (location: LocationProfile) => Exclude<Place, LocationProfile | Coordinate>[];
 /**
  * Check if a place is on a floor.
  */
 export declare const isOnFloor: (place: Place, floor: Floor | string | undefined) => boolean;
+/**
+ * Convert the opening hours format from the SDK to a format the viewer wants to render.
+ */
+export declare const convertHours: (hours: LocationProfile["openingHours"], tz?: string) => OpeningHours;

package/dist/types/src/lib/utils/icon-utils.d.ts

@@ -16,6 +16,6 @@ export declare const loadSelfServeIcon: (type: keyof typeof SelfServeIcons, id:
  */
 export declare const getIconAsString: (icon: string, color?: string) => string;
 export declare const attemptIconNameForConnection: (type: string) => string;
-export declare const attemptIconNameForLocation: (place: Place) => string;
-export declare const attemptIconForLocation: (place: Place, color?: string) => string | undefined;
-export declare const attemptIconImageForLocation: (place: Place) => string | undefined;
+export declare const attemptIconNameForPlace: (place: Place) => string;
+export declare const attemptIconForPlace: (place: Place, color?: string) => string | undefined;
+export declare const attemptIconImageForPlace: (place: Place) => string | undefined;

package/dist/types/src/lib/utils/object-utils.d.ts

@@ -11,4 +11,12 @@ type SetValues<T> = Required<T>[SetKeys<T>] extends Set<infer U> ? U : never;
  * Add a value to a set property of an object, creating the set if it doesn't exist.
  */
 export declare const safeAdd: <T extends object>(object: T, key: SetKeys<T>, value: SetValues<T>) => void;
+/**
+ * Whether the object has an array property with a length greater than 0.
+ */
+export declare const hasArray: <T extends object>(object: T, key: string) => boolean;
+/**
+ * Whether the object has a string property with a length greater than 0.
+ */
+export declare const hasString: <T extends object>(object: T, key: string) => boolean;
 export {};

package/dist/types/src/lib/utils/process-places.d.ts

@@ -1,4 +1,4 @@
-import { Area, Coordinate, Floor, Geometry, MapData, Place, PlaceTypeString } from '../sdk';
+import { Area, Coordinate, Floor, Geometry, LocationCategory, MapData, LocationProfile, Place, PlaceTypeString } from '../sdk';
 import rbush from '@turf/geojson-rbush';
 import { GeoJsonProperties, Point, Polygon, Geometry as GeoJSONGeometry } from 'geojson';
 type RBush<G extends GeoJSONGeometry, P extends GeoJsonProperties> = ReturnType<typeof rbush<G, P>>;
@@ -19,7 +19,9 @@ type TProcessedPlaces = {
     geometriesById: Record<string, Geometry>;
     sortedPlaceNames: string[];
     floorsByNameNormalized: Record<string, Floor>;
+    categoriesByNameNormalized: Record<string, LocationCategory>;
     rbushByFloorId: Record<string, RBush<Point | Polygon, TLookupProperties>>;
+    locationsByPlaceId: Record<string, LocationProfile[]>;
 };
 /**
  * Generate a bunch of useful immutable collections from the map data.

package/dist/types/src/lib/utils/search-utils.d.ts

@@ -1,14 +1,17 @@
-import { Hyperlink } from '../sdk';
+import { LocationLink } from '@mappedin/mvf';
+import { Hyperlink, LocationCategory } from '../sdk';
 import { TMatch } from '../types/search';
 export declare const MIN_QUERY_LENGTH: 2;
 export declare const LINK_INDEXING_JOIN_CHAR = " ";
+export declare const CATEGORY_INDEXING_JOIN_CHAR = ",";
 type TMatchDisplayData = {
     categoryMatchTerms: string[];
     labelMatchTerms: string[];
     detailsText: string;
     detailsMatchTerms: string[];
 };
-export declare const formatLinksForIndexing: (links: Hyperlink[]) => string;
+export declare const formatLinksForIndexing: (links: Hyperlink[] | LocationLink[]) => string;
+export declare const formatCategoriesForIndexing: (categories: LocationCategory[]) => string;
 export declare const getDetailsMatchText: (matches: TMatch[], maxLength: number, debug?: boolean) => string;
 export declare const getMatchData: (matches: TMatch[], maxDetailTextLength: number, debug?: boolean) => TMatchDisplayData;
 export {};

package/dist/types/src/states/location-card.d.ts

@@ -0,0 +1,4 @@
+declare const LocationCard: (() => import("react").JSX.Element) & {
+    displayName: string;
+};
+export default LocationCard;

package/dist/types/src/states/main-ui.d.ts

@@ -0,0 +1,4 @@
+declare const MainUI: (() => import("react").JSX.Element | null) & {
+    displayName: string;
+};
+export default MainUI;

package/dist/types/src/stores/analytics-store/index.d.ts

@@ -11,6 +11,9 @@ type TAnalyticsEventPayload = {
     'select-from-search-result': {
         placeIds: string[];
     };
+    'select-category': {
+        categoryId: string;
+    };
     'get-directions': {
         mode: E_DEPARTURE_MODE;
         fromIds: string[];