@mapsight/ui 7.1.0 → 7.2.0

package/src/js/embed/browser.ts

@@ -1,89 +0,0 @@
-import merge from "lodash/merge";
-
-import type {MapsightStyleFunction} from "@mapsight/lib-ol/style/styleFunction";
-
-import {create} from "../index";
-import browserDomRenderer from "../renderer/browser-dom";
-import type {CreateOptions, MapsightUiRenderFunction} from "../types";
-
-type Options = {
-	/** style function */
-	styleFunction: MapsightStyleFunction;
-
-	/** base mapsight core config */
-	baseMapsightConfig: object;
-
-	/**create options */
-	createOptions: CreateOptions;
-};
-
-/**
- * Browser embed
- *
- * @param container the container element to render the app into
- * @param options
- * @returns render function
- */
-export default function browserEmbed(
-	container: HTMLElement,
-	options: Options,
-): MapsightUiRenderFunction<any> | undefined {
-	const {
-		styleFunction,
-		baseMapsightConfig = {},
-		createOptions = {},
-	} = options;
-
-	const {dehydratedStateAttributeName = "data-dehydrated-state"} =
-		createOptions;
-
-	createOptions.renderer = createOptions.renderer || browserDomRenderer;
-
-	if (
-		!createOptions.reHydratedState &&
-		dehydratedStateAttributeName &&
-		container
-	) {
-		pullDeHydratedStateFromContainer(
-			createOptions,
-			dehydratedStateAttributeName,
-			container,
-		);
-	}
-	createOptions.uiState = merge({}, createOptions.uiState || {});
-
-	const {render} = create(
-		container,
-		styleFunction,
-		baseMapsightConfig,
-		createOptions,
-	);
-
-	// initial render
-	if (render !== undefined) {
-		render({});
-	}
-
-	return render;
-}
-
-function pullDeHydratedStateFromContainer(
-	createOptions: CreateOptions,
-	dehydratedStateAttributeName: string,
-	container: HTMLElement,
-): void {
-	const stateJson = container.getAttribute(dehydratedStateAttributeName);
-	if (stateJson === null) {
-		return;
-	}
-
-	try {
-		createOptions.reHydratedState = JSON.parse(stateJson);
-		container.setAttribute(dehydratedStateAttributeName, "");
-	} catch (e) {
-		console.error(
-			"mapsight ui: error reading dehydrated state from container",
-			e,
-		);
-	}
-}

package/src/js/embed/node.ts

@@ -1,57 +0,0 @@
-import type {MapsightStyleFunction} from "@mapsight/lib-ol/style/styleFunction";
-
-import {create} from "..";
-import serverStringRenderer from "../renderer/server-string";
-import type {CreateOptions} from "../types";
-
-type Options = {
-	/** style function */
-	styleFunction: MapsightStyleFunction;
-
-	/** base mapsight core config */
-	baseMapsightConfig: object;
-
-	/**create options */
-	createOptions: CreateOptions;
-};
-
-type Result = {
-	store: any;
-	// (function(*=): undefined)
-	render(...something: Array<any>): void;
-	// (function(*=): Promise<undefined>)
-	renderAsync(...something: Array<any>): Promise<void>;
-};
-
-/**
- * Node embed
- *
- * @returns embed reference
- */
-export default function nodeEmbed(options: Options): Result {
-	const {
-		styleFunction,
-		baseMapsightConfig = {},
-		createOptions = {},
-	} = options;
-
-	createOptions.renderer = createOptions.renderer ?? serverStringRenderer;
-
-	const ctx = create(null, styleFunction, baseMapsightConfig, createOptions);
-
-	function render(renderProps = {}) {
-		if (ctx.render) {
-			ctx.render(renderProps);
-		}
-	}
-
-	async function renderAsync(renderProps = {}) {
-		if (ctx.renderAsync) {
-			await ctx.renderAsync(renderProps);
-		}
-	}
-
-	// for node we do not render but return an object with
-	// references to store and async render function
-	return {store: ctx.store, render, renderAsync};
-}

package/src/js/filters/tag-filter.ts

@@ -1,135 +0,0 @@
-import type {FilterFunction} from "@mapsight/core/lib/filter/types";
-
-import getPath from "@mapsight/lib-js/object/getPath";
-
-import type {MapsightUiFeature} from "../types";
-
-type CacheEntry = {
-	features: Array<MapsightUiFeature>;
-	filtered: Array<MapsightUiFeature>;
-	visibleTags: Record<string, Array<string>>;
-	visibleTagGroups: Record<string, boolean>;
-};
-
-/**
- * Creates a cached tag filter function
- */
-export function createTagFilterFunction(): FilterFunction {
-	const cache: Record<string, CacheEntry> = {};
-
-	return function tagFilterFunction(_features, filterState, featureSourceId) {
-		// FIXME: unify types for Features in core and ui
-		const features = _features as MapsightUiFeature[];
-
-		// early return if parameters are missing
-		if (!featureSourceId || !filterState || !features) {
-			return features;
-		}
-
-		// show all features, if no tag is selected
-		const visibleTags = getPath(filterState, [
-			"visibleTags",
-			featureSourceId,
-		]) as Record<string, string[]>;
-		const visibleTagGroups = getPath(filterState, [
-			"visibleTagGroups",
-			featureSourceId,
-		]) as Record<string, boolean>;
-		if (!visibleTags && !visibleTagGroups) {
-			return features;
-		}
-
-		let fromCache = cache[featureSourceId];
-
-		if (
-			fromCache === undefined ||
-			fromCache.features !== features ||
-			fromCache.visibleTags !== visibleTags ||
-			fromCache.visibleTagGroups !== visibleTagGroups
-		) {
-			const flattenedTags = transformTagMapsToArrays(
-				visibleTags,
-				visibleTagGroups,
-			);
-
-			fromCache = cache[featureSourceId] = {
-				// inputs:
-				features: features,
-				visibleTags: visibleTags,
-				visibleTagGroups: visibleTagGroups,
-				// output:
-				filtered: features.filter((feature) =>
-					flattenedTags.every(({group, tags}) =>
-						isFeatureMatchingFilter(feature, group, tags),
-					),
-				),
-			};
-		}
-
-		return fromCache?.filtered;
-	};
-}
-
-/**
- * @deprecated Do not use. This uses a global cache. Use export createTagFilterFunction instead to create local function per mapsight instance!
- */
-const deprecatedTagFilterFunction = createTagFilterFunction();
-export default deprecatedTagFilterFunction;
-
-function transformTagMapsToArrays(
-	visibleTags: Record<string, Array<string>> | null = null,
-	visibleTagGroups: Record<string, boolean> | null = null,
-) {
-	const result = {};
-	if (visibleTags) {
-		Object.keys(visibleTags).forEach((group) => {
-			const tags = getVisibleTagsForGroup(visibleTags, group);
-			if (tags.length) {
-				result[group] = tags;
-			}
-		});
-	}
-	if (visibleTagGroups) {
-		Object.keys(visibleTagGroups).forEach((group) => {
-			const isActive = !!visibleTagGroups[group];
-
-			if (isActive) {
-				result[group] = result[group] || true;
-			}
-		});
-	}
-
-	return Object.keys(result).map((group) => {
-		const tags = result[group];
-		return {group: group, tags: tags};
-	});
-}
-
-function getVisibleTagsForGroup(
-	visibleTags: Record<string, Array<string>>,
-	tagGroup: string,
-) {
-	return Object.keys(visibleTags[tagGroup]!).filter(
-		(tag) => visibleTags[tagGroup]![tag] === true,
-	);
-}
-
-function isFeatureMatchingFilter(
-	feature: MapsightUiFeature,
-	group: string,
-	visibleTags: boolean | Array<string>,
-): boolean {
-	const featureData = feature.properties?.tagGroups?.[group];
-	if (!featureData) {
-		return false;
-	}
-
-	const {andJunction, tags} = featureData;
-	if (visibleTags === true) {
-		return !!tags.length;
-	}
-
-	return visibleTags[andJunction === true ? "every" : "some"](
-		(tag) => tags.indexOf(tag) > -1,
-	);
-}

package/src/js/filters/time-filter.ts

@@ -1,53 +0,0 @@
-import type {FilterFunction} from "@mapsight/core/lib/filter/types";
-
-import {unreachable} from "@mapsight/lib-js/unreachable";
-
-type TimeFilterState = {
-	options?: {
-		/** from datetime in ISO 8601 (Y-m-d\TH:i:sP) */
-		fromDate?: string;
-		/** to datetime in ISO 8601 (Y-m-d\TH:i:sP) */
-		toDate?: string;
-		/** if set to true the filter will filter even if neither from nor to date are set. */
-		allowEmpty?: boolean;
-	};
-};
-
-// TODO: document/collect magic property names
-export interface FeatureWithWhen {
-	when?: object;
-	/** start datetime in ISO 8601 (Y-m-d\TH:i:sP) */
-	start: string;
-	/** end datetime in ISO 8601 (Y-m-d\TH:i:sP) */
-	end: string;
-}
-
-/**
- * Feature filter to filter by when property in a time range.
- * Features are expected to have a when object property with
- * start and end datetimes.
- */
-const timeFilter: FilterFunction = (features, filterState: TimeFilterState) => {
-	const filterOptions = filterState.options;
-	if (!filterOptions) {
-		return features;
-	}
-
-	const {fromDate, toDate, allowEmpty = false} = filterOptions;
-	if (!allowEmpty && !fromDate && !toDate) {
-		return features;
-	}
-
-	// TODO: document/collect magic property names (here: when.start, when.end)
-	const predicate = toDate
-		? (feature) =>
-				feature?.when?.start <= toDate &&
-				feature?.when?.end >= (fromDate || Date.now())
-		: fromDate
-			? (feature) => feature?.when?.end >= fromDate
-			: unreachable();
-
-	return features.filter(predicate);
-};
-
-export default timeFilter;

package/src/js/helpers/components.ts

@@ -1,66 +0,0 @@
-import type {ComponentType, ReactNode} from "react";
-import {createContext, createElement, useCallback, useContext} from "react";
-
-// eslint-disable-next-line @typescript-eslint/no-empty-object-type
-export interface ComponentProps {
-	// extendable
-}
-
-export type PropsWithFallback<P = unknown> = P & {
-	fallback?: ReactNode | undefined;
-};
-
-/** @deprecated */
-export type ComponentPropsWithFallback = {
-	MapOverlayModal: PropsWithFallback;
-	MapOverlayStart: PropsWithFallback;
-	MapOverlayEnd: PropsWithFallback;
-	MapOverlayTopLeft: PropsWithFallback;
-	MapOverlayTopRight: PropsWithFallback;
-	MapOverlayBottomLeft: PropsWithFallback;
-	MapOverlayBottomRight: PropsWithFallback;
-};
-
-export type MapsightUiComponents = {
-	[N in keyof ComponentProps]?: ComponentType<ComponentProps[N]>;
-} & {
-	[N in keyof ComponentPropsWithFallback]?: ComponentType<
-		ComponentPropsWithFallback[N]
-	>;
-};
-
-export const ComponentsContext = createContext<MapsightUiComponents>({});
-ComponentsContext.displayName = "ComponentsContext";
-
-/** @deprecated */
-export function useContextComponentWithFallback<
-	N extends keyof ComponentPropsWithFallback,
->(
-	componentName: N,
-): (fallback?: ReactNode, props?: ComponentPropsWithFallback[N]) => ReactNode {
-	const Comp = useContext(ComponentsContext)[componentName];
-	return useCallback(
-		(fallback, props) => {
-			if (Comp) {
-				return createElement(Comp, {...props, fallback});
-			}
-			return fallback;
-		},
-		[Comp],
-	);
-}
-
-export function makeReplaceableComponent<N extends keyof ComponentProps>(
-	componentName: N,
-	Component: ComponentType<ComponentProps[N]>,
-): ComponentType<ComponentProps[N]> {
-	const NewComp: ComponentType<ComponentProps[N]> = (props) => {
-		const CtxComp = useContext(ComponentsContext)[componentName];
-		if (CtxComp !== undefined) {
-			return createElement(CtxComp as any, props as any);
-		}
-		return createElement(Component as any, props as any);
-	};
-	NewComp.displayName = `MsUiReplaceable${componentName}`;
-	return NewComp;
-}

package/src/js/helpers/create-action-watcher.ts

@@ -1,35 +0,0 @@
-// FIXME: use es once default export is fixed in @mapsight/lib-redux
-import type {AnyAction, StoreEnhancer} from "@reduxjs/toolkit";
-import {applyMiddleware} from "@reduxjs/toolkit";
-
-import {isNonNullable} from "@mapsight/lib-js/nonNullable";
-import flattenActions from "@mapsight/lib-redux/flatten-actions";
-
-type Result = {
-	handler: null | ((action: AnyAction) => void);
-	enhancer: StoreEnhancer<{dispatch: unknown}>;
-};
-
-// TODO: This is a candidate for lib-redux
-export default function createActionWatcher(): Result {
-	const context: Partial<Result> = {
-		handler: null,
-	};
-
-	context.enhancer = applyMiddleware(
-		(_store) => (nextMiddleware) => (action: AnyAction) => {
-			const result = nextMiddleware(action);
-
-			if (isNonNullable(context.handler)) {
-				const {handler} = context;
-				flattenActions(action).map((singleAction) =>
-					handler(singleAction),
-				);
-			}
-
-			return result;
-		},
-	);
-
-	return context as Result;
-}

package/src/js/helpers/events.ts

@@ -1,11 +0,0 @@
-/**
- * Returns `true` if no modifier key is pressed for the event.
- */
-export function isEventWithNoModKeys(event: {
-	altKey: boolean;
-	ctrlKey: boolean;
-	shiftKey: boolean;
-	metaKey: boolean;
-}): boolean {
-	return !event.altKey && !event.ctrlKey && !event.metaKey && !event.shiftKey;
-}

package/src/js/helpers/get-feature-property.ts

@@ -1,14 +0,0 @@
-import getPath from "@mapsight/lib-js/object/getPath";
-
-import type {MapsightUiFeature, MapsightUiFeatureProperty} from "../types";
-
-/**
- * Gets the property value by key, falling back to the specified fallback if value is not defined.
- */
-export default function getFeatureProperty(
-	feature: MapsightUiFeature,
-	key: MapsightUiFeatureProperty,
-	fallback: unknown = null,
-) {
-	return getPath(feature, ["properties", key], fallback);
-}

package/src/js/helpers/i18n/de.ts

@@ -1,145 +0,0 @@
-import {
-	STATUS_ERROR,
-	STATUS_LOADING,
-} from "@mapsight/core/lib/feature-sources/selectors";
-
-import {
-	STATUS_ACTIVE,
-	STATUS_INACTIVE,
-} from "../../components/switcher/SwitcherEntry";
-import {
-	VIEW_DESKTOP,
-	VIEW_FULLSCREEN,
-	VIEW_MAP_ONLY,
-	VIEW_MOBILE,
-	ZOOM_IN,
-	ZOOM_OUT,
-} from "../../config/constants/app";
-
-/*  eslint quote-props: 0 */
-
-const de: Record<string, string> = {
-	open: "öffnen",
-	close: "schließen",
-	reset: "zurücksetzen",
-	show: "anzeigen",
-	from: "von",
-	nextEntry: "Vorheriger Eintrag",
-	prevEntry: "Nächster Eintrag",
-
-	"ui.query-input.reset": "Suche zurücksetzen",
-
-	"ui.feature-details.share-link.head": "Link teilen...",
-	"ui.feature-details.share-link.place": "Link zum ausgewählten Ort:",
-	"ui.feature-details.share-link.close": "Link-teilen-Dialog schließen",
-
-	"ui.feature-details.content-inner.error": "Fehler beim Laden der Details.",
-	"ui.feature-details.content-inner.gotoPage": "Direkt zur Seite springen",
-	"ui.feature-details.content-inner.loading": "Lade Details …",
-
-	"ui.main-panel.list-toggle.open": "Liste öffnen",
-	"ui.main-panel.list-toggle.close": "Liste schließen",
-
-	"ui.feature-list.sorting.byDistance":
-		"Meldungen nach Entfernung sortieren:",
-	"ui.feature-list.sorting.choose": "Standort wählen ...",
-	"ui.feature-list.sorting.own": "eigenen Standort verwenden",
-	"ui.feature-list.sorting.announcements": "Meldungen sortieren …",
-
-	"ui.feature-list.content.noListSelected": "keine Liste gewählt",
-	"ui.feature-list.content.noEntries": "keine Einträge",
-	"ui.feature-details.content.title": "Bezeichnung",
-	"ui.feature-details.content.description": "Bemerkung",
-
-	"ui.feature-list.query-input.search": "Textsuche in Liste darunter",
-	"ui.feature-list.query-input.placeholder": "In Liste suchen …",
-
-	"ui.time-filter.span": "Vorschauzeitraum festlegen",
-
-	"ui.search.send": "Suchen",
-
-	"ui.search.result.error": "Fehler beim Laden der Suchergebnisse",
-	"ui.search.result.empty": "Keine Ergebnisse gefunden",
-
-	"ui.search.query-input.label": "Straße oder Ort",
-	"ui.search.query-input.placeholder": "Straße oder Ort ...",
-
-	"ui.feature-selection-info.close": "Informationsdialog schließen",
-
-	"ui.map-overlay.search.open": "Suche öffnen",
-	"ui.map-overlay.search.close": "Suche schließen",
-	"ui.map-overlay.search.modal.label": "Suchfunktion",
-	"ui.map-overlay.search.modal.headline": "Suche",
-
-	"ui.map-overlay.logo.copyright": "Diese Kartenanwendung nutzt Mapsight",
-
-	"ui.map-overlay.info.modal.label": "Quellenangaben und Informationen",
-	"ui.map-overlay.info.modal.headline": "Quellenangaben und Informationen",
-	"ui.map-overlay.info.closeSources":
-		"Quellenangaben und Informationen schließen",
-	"ui.map-overlay.info.legend": "Legende",
-	"ui.map-overlay.info.closeLegend": "Legende schließen",
-	"ui.map-overlay.info.open":
-		"Quellenangaben und weitere Informationen öffnen",
-
-	"ui.map-overlay.layer-switcher.modal.label": "Ebenenauswahl",
-	"ui.map-overlay.layer-switcher.layers": "Ebenen",
-	"ui.map-overlay.layer-switcher.closeLayers": "Ebenenauswahl schließen",
-	"ui.map-overlay.layer-switcher.openLayers": "Ebenenauswahl öffnen",
-
-	// HOWTO: wrap the metadata one base layer of the project with something like
-	// 		withLegend(_metadata, `<article><h1>${translate('ui.map.usage.heading')}</h1>${translate('ui.map.usage.html')}</article>`)
-	// change 'ui.map-overlay.info.legend' according to the use case, ie. set it to "Tastaturbedienung" if there are no other legends, or to "Legende und Tastaturbedienung" if there are such further legends
-	// additinally adapt 'ui.map-overlay.info.open'
-	"ui.map.usage.heading": "Tastaturbedienung der Karte",
-	"ui.map.usage.html":
-		'<dl class="ms3-map-usage">' +
-		'<dt><kbd aria-label="Cursor rechts">→</kbd></dt><dd>nach rechts verschieben</dd>' +
-		'<dt><kbd aria-label="Cursor links">←</kbd></dt><dd>nach links verschieben</dd>' +
-		'<dt><kbd aria-label="Cursor runter">↓</kbd></dt><dd>nach unten verschieben</dd>' +
-		'<dt><kbd aria-label="Cursor hoch">↑</kbd></dt><dd>nach oben verschieben</dd>' +
-		"<dt><kbd>+</kbd></dt><dd>hineinzoomen</dd>" +
-		"<dt><kbd>-</kbd></dt><dd>herauszoomen</dd>" +
-		"</dl>",
-	"ui.map.visuallyhidden":
-		"Dieser Bereich der Webseite zeigt eine Landkarte.",
-
-	[`ui.view-toggle-button.ariaLabel${VIEW_MAP_ONLY}`]: "Zur Karte wechseln",
-	[`ui.view-toggle-button.ariaLabel${VIEW_FULLSCREEN}`]:
-		"Zum Vollbild wechseln",
-	[`ui.view-toggle-button.ariaLabel${VIEW_DESKTOP}`]: "Vollbild schließen",
-	[`ui.view-toggle-button.ariaLabel${VIEW_MOBILE}`]: "Zur Liste wechseln",
-
-	[`ui.view-toggle-button.label${VIEW_MAP_ONLY}`]: "Karte",
-	[`ui.view-toggle-button.label${VIEW_FULLSCREEN}`]: "Vollbild",
-	[`ui.view-toggle-button.label${VIEW_DESKTOP}`]: "Vollbild",
-	[`ui.view-toggle-button.label${VIEW_MOBILE}`]: "Liste",
-
-	[`ui.zoom-button.ariaLabel${ZOOM_OUT}`]: "Karte verkleinern",
-	[`ui.zoom-button.ariaLabel${ZOOM_IN}`]: "Karte vergrößern",
-	[`ui.zoom-button.label${ZOOM_OUT}`]: "Verkleinern",
-	[`ui.zoom-button.label${ZOOM_IN}`]: "Vergrößern",
-
-	[`ui.switcher.entry.label${STATUS_ERROR}`]: "Fehler beim Laden",
-	[`ui.switcher.entry.label${STATUS_LOADING}`]: "Lädt",
-	[`ui.switcher.entry.label${STATUS_ACTIVE}`]: "Aktiv",
-	[`ui.switcher.entry.label${STATUS_INACTIVE}`]: "Inaktiv",
-
-	"ui.user-geo-location-button.label": "Zum eigenen Standort springen",
-	"ui.user-geo-location-button.ariaLabel": "Zum eigenen Standort springen",
-
-	"ui.pagination.nextPage": ">",
-	"ui.pagination.prevPage": "<",
-	"ui.pagination.nextPageLabel": "Zur nächsten Seite blättern",
-	"ui.pagination.prevPageLabel": "Zur vorherigen Seite blättern",
-	"ui.pagination.goToSelectedPageLabel": "Sie sind aktuell auf Seite {page}",
-	"ui.pagination.goToPageLabel": "Zur Seite {page} blättern",
-
-	"ui.share-position-link.title": "Ort teilen",
-	"ui.share-position-link.instructions":
-		"Klicken Sie auf die Karte um einen Ort zu teilen.",
-	"ui.share-position-link.shareTitle": "Markierten Ort teilen",
-	"ui.share-position-link.shareButtonLabel": "Markierten Ort teilen",
-};
-
-export default de;