@mappedin/viewer 0.0.0-alpha → 0.2.0

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import './lib/i18n';
+import './fonts.css';
+import { TStartViewerOptions, TStartViewerWithLocalDataOptions } from './lib/types/options';
+import '@mappedin/mappedin-js/lib/mappedin.css';
+declare const App: ((options: TStartViewerOptions | TStartViewerWithLocalDataOptions) => import("react").JSX.Element) & {
+    displayName: string;
+};
+export default App;

package/dist/types/src/components/animations/animated-resize.d.ts

@@ -0,0 +1,13 @@
+import React, { PropsWithChildren } from 'react';
+type TAnimateResizeProps = {
+    maxHeight?: number;
+    maxWidth?: number;
+    style?: React.CSSProperties;
+    contentStyle?: React.CSSProperties;
+    animateHeight?: boolean;
+    animateWidth?: boolean;
+    debug?: boolean;
+};
+declare const _AnimatedResize: React.FC<PropsWithChildren<TAnimateResizeProps>>;
+declare const AnimatedResize: typeof _AnimatedResize;
+export default AnimatedResize;

package/dist/types/src/components/animations/animation-context.d.ts

@@ -0,0 +1,22 @@
+import { MutableRefObject, ReactNode } from 'react';
+type TAnimationContext = {
+    /**
+     * The element that is currently animating. This is useful for stateful reactions.
+     * Use animatingElementRef to if you don't care about reactions.
+     */
+    animatingElement: HTMLElement | null;
+    /**
+     * A ref to the element that is currently animating. Use animatingElement if you care
+     * about reacting to state.
+     */
+    animatingElementRef: MutableRefObject<HTMLElement | null>;
+    /**
+     * Update the currently animating element.
+     */
+    setIsElementAnimating: (element: HTMLElement, isAnimating: boolean) => void;
+};
+export declare const AnimationContext: import("react").Context<TAnimationContext>;
+export declare const EnsureAnimationContext: React.FC<{
+    children: ReactNode;
+}>;
+export {};

package/dist/types/src/components/animations/animation.stories.d.ts

@@ -0,0 +1,2 @@
+import type { Story } from '@ladle/react';
+export declare const Height: Story;

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

@@ -0,0 +1 @@
+export declare const ANIMATION_DURATION_MS = 125;

package/dist/types/src/components/button/button.stories.d.ts

@@ -0,0 +1,3 @@
+import type { Story } from '@ladle/react';
+export declare const WithIcon: Story;
+export declare const WithText: Story;

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

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { TTheme } from 'lib/types/theme';
+export declare const clickableStyle: import("styled-components").RuleSet<object>;
+declare const Button: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
+    theme?: TTheme | undefined;
+    disabled?: boolean | undefined;
+}>>;
+export default Button;

package/dist/types/src/components/caret/caret.stories.d.ts

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

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

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+type TChevronProps = {
+    size?: number;
+    direction?: 'up' | 'down' | 'left' | 'right';
+};
+declare const Caret: React.FC<TChevronProps>;
+export default Caret;

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

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

package/dist/types/src/components/categories/category.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { TSearchResult } from 'lib/types/search';
+type TCategoryProps = {
+    name: string;
+    results: TSearchResult[];
+    onResultClick?: (result: TSearchResult) => void;
+};
+declare const Category: React.FC<TCategoryProps>;
+export default Category;

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

@@ -0,0 +1,11 @@
+import { ComponentProps } from 'react';
+import { TCategory } from 'lib/types/search';
+import Category from './category';
+type TCategoriesProps = {
+    categories: TCategory[];
+    onResultClick?: ComponentProps<typeof Category>['onResultClick'];
+    visible?: boolean;
+    maxHeight?: number;
+};
+declare const Categories: React.FC<TCategoriesProps>;
+export default Categories;

package/dist/types/src/components/common/theme-provider.d.ts

@@ -0,0 +1,6 @@
+import React, { PropsWithChildren } from 'react';
+import { TTheme } from '../../lib/types/theme';
+declare const ThemeProvider: React.FC<PropsWithChildren<{
+    theme?: TTheme;
+}>>;
+export default ThemeProvider;

package/dist/types/src/components/common/typography.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { TTheme } from '../../lib/types/theme';
+type TFontProps = {
+    theme?: TTheme;
+    strokeWidth?: number;
+    strokeColor?: string;
+};
+export declare const fontStyle: import("styled-components").RuleSet<TFontProps>;
+export declare const Text: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, TFontProps>>;
+export {};

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

@@ -0,0 +1 @@
+export declare const id: (...values: string[]) => string;

package/dist/types/src/components/connection-marker/connection-marker.stories.d.ts

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

package/dist/types/src/components/connection-marker/index.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+type TConnectionMarkerProps = {
+    type?: string;
+    active?: boolean;
+    direction?: 'up' | 'down';
+    size?: number;
+    onClick?: () => void;
+};
+declare const ConnectionMarker: React.FC<TConnectionMarkerProps>;
+export default ConnectionMarker;

package/dist/types/src/components/directions/departure-modes.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { E_DEPARTURE_MODE } from '../../lib/types/directions';
+type TDepartureModes = {
+    mode: E_DEPARTURE_MODE;
+    onModeClick?: (mode: E_DEPARTURE_MODE) => void;
+};
+declare const DepartureModes: React.FC<TDepartureModes>;
+export default DepartureModes;

package/dist/types/src/components/directions/directions-button.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+type TDirectionsButtonProps = {
+    onClick?: () => void;
+    visible?: boolean;
+    disabled?: boolean;
+};
+declare const DirectionsButton: React.FC<TDirectionsButtonProps>;
+export default DirectionsButton;

package/dist/types/src/components/directions/directions-search-bar.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { TSearchResult } from 'lib/types/search';
+type TDirectionsSearchBarProps = {
+    query?: string;
+    onQueryChange?: (query: string) => void;
+    results: TSearchResult[];
+    onResultSelected?: (result: TSearchResult) => void;
+    visible?: boolean;
+};
+declare const DirectionsSearchBar: React.FC<TDirectionsSearchBarProps>;
+export default DirectionsSearchBar;

package/dist/types/src/components/directions/directions.stories.d.ts

@@ -0,0 +1,5 @@
+import type { Story } from '@ladle/react';
+export declare const Default: Story;
+export declare const Modes: Story;
+export declare const Search: Story;
+export declare const MainButton: Story;

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

@@ -0,0 +1,17 @@
+import { E_DEPARTURE_MODE } from '../../lib/types/directions';
+import DepartureModes from './departure-modes';
+import { ComponentProps } from 'react';
+import DirectionsSearchBar from './directions-search-bar';
+type TDirectionsProps = {
+    departureMode?: ComponentProps<typeof DepartureModes>['mode'];
+    departureQuery?: ComponentProps<typeof DirectionsSearchBar>['query'];
+    onDepartureQueryChange?: ComponentProps<typeof DirectionsSearchBar>['onQueryChange'];
+    onDepartureModeChange?: (mode: E_DEPARTURE_MODE) => void;
+    departureSearchResults: ComponentProps<typeof DirectionsSearchBar>['results'];
+    onDepartureResultSelected?: ComponentProps<typeof DirectionsSearchBar>['onResultSelected'];
+    visible?: boolean;
+    warningVisible?: boolean;
+    maxHeight?: number;
+};
+declare const Directions: React.FC<TDirectionsProps>;
+export default Directions;

package/dist/types/src/components/dropped-pin-marker/dropped-pin-hover.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+type TDroppedPinHoverProps = {
+    visible?: boolean;
+    getIsValid?: () => boolean;
+};
+declare const DroppedPinHover: React.FC<TDroppedPinHoverProps>;
+export default DroppedPinHover;

package/dist/types/src/components/dropped-pin-marker/dropped-pin-marker.stories.d.ts

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

package/dist/types/src/components/dropped-pin-marker/index.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+type TDroppedPinProps = {
+    type?: 'departure' | 'destination';
+};
+declare const DroppedPin: React.FC<TDroppedPinProps>;
+export default DroppedPin;

package/dist/types/src/components/dropped-pin-marker/use-follow-cursor.d.ts

@@ -0,0 +1,17 @@
+import { ReactElement } from 'react';
+type TUseFollowCursorCanvasProps = {
+    icon: ReactElement<SVGSVGElement>;
+    iconFillColor?: string;
+    iconStrokeColor?: string;
+    visible?: boolean;
+    translate?: {
+        x: number;
+        y: number;
+    };
+    hoverHeight?: number;
+    getIsValid?: () => boolean;
+};
+declare const useFollowCursorCanvas: ({ icon, iconFillColor, iconStrokeColor, visible, translate, hoverHeight, getIsValid, }: TUseFollowCursorCanvasProps) => {
+    containerRef: (ref: unknown) => void;
+};
+export default useFollowCursorCanvas;

package/dist/types/src/components/dropped-pin-marker/utils.d.ts

@@ -0,0 +1,8 @@
+export declare const HOVER_PIN_ALTITUDE = 50;
+export declare const PIN_SHADOW_WIDTH = 12;
+export declare const PIN_SHADOW_HEIGHT = 5;
+export declare const PIN_SHADOW_HOVER_SCALE = 0.9;
+export declare const DESTINATION_PIN_COLOR = "#722ED1";
+export declare const HOVER_PIN_COLOR = "#D46B08";
+export declare const PIN_SHADOW_OPACITY = 0.35;
+export declare const PIN_DROP_ANIMATION_DURATION_MS = 250;

package/dist/types/src/components/hint/hint.stories.d.ts

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

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

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+type THintProps = {
+    text: string;
+};
+declare const Hint: React.FC<THintProps>;
+export default Hint;

package/dist/types/src/components/hover/hover-element-with-arrow.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { TTheme } from 'lib/types/theme';
+declare const HoverElementWithArrow: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    backgroundColor?: string | undefined;
+    theme?: TTheme | undefined;
+}>>;
+export default HoverElementWithArrow;

package/dist/types/src/components/hover/hover.stories.d.ts

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

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

@@ -0,0 +1,16 @@
+import { PropsWithChildren } from 'react';
+import { TDirection, THoverAnimation } from './utils';
+export type THoverPlacement = TDirection;
+type THoverProps = {
+    element: React.ReactElement;
+    elementPadding?: number;
+    elementPersistOnElementHover?: boolean;
+    elementHidesOnElementClick?: boolean;
+    elementArrow?: boolean;
+    expandToFillPerpendicular?: boolean;
+    placement?: THoverPlacement;
+    animation?: THoverAnimation;
+    visible?: boolean;
+};
+declare const Hover: React.FC<PropsWithChildren<THoverProps>>;
+export default Hover;

package/dist/types/src/components/hover/use-hover-element.d.ts

@@ -0,0 +1,14 @@
+type TUseHoverElementProps = {
+    delay?: number;
+    visible?: boolean;
+};
+declare const useHoverElement: ({ delay, visible }: TUseHoverElementProps) => {
+    onContainerMouseEnter: () => void;
+    onContainerMouseLeave: () => void;
+    onHoverElementMouseEnter: () => void;
+    onHoverElementMouseLeave: () => void;
+    hideHoverElement: () => void;
+    isAnimating: boolean;
+    isHoverElementVisible: boolean;
+};
+export default useHoverElement;

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

@@ -0,0 +1,20 @@
+import { FocusEvent } from 'react';
+export type TPrimaryDirection = 'top' | 'bottom' | 'left' | 'right';
+export type TDirection = 'top' | 'bottom' | 'left' | 'right' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'left-top' | 'left-bottom' | 'right-top' | 'right-bottom';
+export type THoverAnimation = 'expand' | 'fade' | 'fade-expand' | 'none';
+export declare const ARROW_SIZE: 6;
+export declare const getPrimaryDirection: (direction: TDirection) => TPrimaryDirection;
+export declare const getMaxDimension: (visible: boolean, animation: THoverAnimation, value?: number) => any;
+export declare const useElementDimensions: () => {
+    onRef: (ref: unknown) => void;
+    height: number;
+    width: number;
+};
+/**
+ * Hook for controlling hover visibility outside the component
+ */
+export declare const useHoverExternal: () => {
+    visible: boolean;
+    onTriggerClick: () => void;
+    onContainerBlur: (event: FocusEvent<HTMLDivElement>) => void;
+};

package/dist/types/src/components/hover/utils.test.d.ts

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

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

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

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+type TIconProps = {
+    icon: string;
+    width: number;
+    height: number;
+    color?: string;
+};
+declare const Icon: React.FC<TIconProps>;
+export default Icon;

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

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { TTheme } from 'lib/types/theme';
+declare const Input: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, {
+    theme: TTheme;
+}>>;
+export default Input;

package/dist/types/src/components/input/input.stories.d.ts

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

package/dist/types/src/components/level-change-notification/index.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+export declare const PERSIST_DURATION_MS: number;
+type TLevelChangeNotificationProps = {
+    levelName: string;
+    elevation: number;
+};
+declare const LevelChangeNotification: React.FC<TLevelChangeNotificationProps>;
+export default LevelChangeNotification;

package/dist/types/src/components/level-change-notification/level-change-notification.stories.d.ts

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

package/dist/types/src/components/level-selector/index.d.ts

@@ -0,0 +1,9 @@
+import { ComponentProps } from 'react';
+import LevelSelectorMenu from './level-selector-menu';
+type TLevelSelectorProps = {
+    levels: ComponentProps<typeof LevelSelectorMenu>['levels'];
+    selectedLevelId: ComponentProps<typeof LevelSelectorMenu>['selectedLevelId'];
+    onLevelClick?: ComponentProps<typeof LevelSelectorMenu>['onLevelClick'];
+};
+declare const LevelSelector: React.FC<TLevelSelectorProps>;
+export default LevelSelector;

package/dist/types/src/components/level-selector/level-selector-menu.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { TLevelSelectorLevel } from './utils';
+type TLevelSelectorMenuProps = {
+    levels: TLevelSelectorLevel[];
+    selectedLevelId?: string;
+    onLevelClick?: (level: TLevelSelectorLevel) => void;
+    maxItemsToShow?: number;
+};
+declare const LevelSelectorMenu: React.FC<TLevelSelectorMenuProps>;
+export default LevelSelectorMenu;

package/dist/types/src/components/level-selector/level-selector.stories.d.ts

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

package/dist/types/src/components/level-selector/utils.d.ts

@@ -0,0 +1,4 @@
+export type TLevelSelectorLevel = {
+    id: string;
+    name: string;
+};

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

@@ -0,0 +1,28 @@
+import SearchBar from '../search-bar';
+import Directions from '../directions';
+import { ComponentProps } from 'react';
+import { TCategory, TSearchResult } from '../../lib/types/search';
+type TMainUIProps = {
+    onBlur?: () => void;
+    query?: string;
+    onQueryChange?: (query: string) => void;
+    searchResults: TSearchResult[];
+    categories: TCategory[];
+    onResultSelected?: (result: TSearchResult) => void;
+    onSearchBarFocus?: ComponentProps<typeof SearchBar>['onFocus'];
+    onSearchBarBlur?: ComponentProps<typeof SearchBar>['onBlur'];
+    maxHeight?: number;
+    departureMode?: ComponentProps<typeof Directions>['departureMode'];
+    onDepartureModeChange?: ComponentProps<typeof Directions>['onDepartureModeChange'];
+    departureQuery?: ComponentProps<typeof Directions>['departureQuery'];
+    onDepartureQueryChange?: ComponentProps<typeof Directions>['onDepartureQueryChange'];
+    onDepartureResultSelected?: ComponentProps<typeof Directions>['onDepartureResultSelected'];
+    departureSearchResults?: ComponentProps<typeof Directions>['departureSearchResults'];
+    directionsVisible?: boolean;
+    directionsWarningVisible?: boolean;
+    directionsButtonVisible?: boolean;
+    directionsButtonDisabled?: boolean;
+    onDirectionsButtonClick?: () => void;
+};
+declare const MainUI: React.FC<TMainUIProps>;
+export default MainUI;

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

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

package/dist/types/src/components/map-controls/index.d.ts

@@ -0,0 +1,11 @@
+import { ComponentProps } from 'react';
+import TiltControls from '../tilt-controls';
+import ZoomControls from '../zoom-controls';
+type TMapControlsProps = {
+    onTiltChange?: ComponentProps<typeof TiltControls>['onChange'];
+    onZoomInClick?: ComponentProps<typeof ZoomControls>['onZoomInClick'];
+    onZoomOutClick?: ComponentProps<typeof ZoomControls>['onZoomOutClick'];
+    onZoomAllClick?: ComponentProps<typeof ZoomControls>['onZoomAllClick'];
+};
+declare const MapControls: React.FC<TMapControlsProps>;
+export default MapControls;

package/dist/types/src/components/map-controls/map-controls.stories.d.ts

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

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

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { TTheme } from 'lib/types/theme';
+declare const Panel: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    direction?: "row" | "column" | undefined;
+    spacing?: number | undefined;
+    theme?: TTheme | undefined;
+}>>;
+export default Panel;