@opengeoweb/shared 14.3.0 → 14.4.0

package/index.esm.js

@@ -5,7 +5,7 @@ import { initReactI18next, useTranslation } from 'react-i18next';
 import React, { useRef, useEffect, useState, Component } from 'react';
 import Draggable from 'react-draggable';
 import { Resizable } from 're-resizable';
-import { Resize, Options, Close, ChevronLeft, Exclamation, Success, Info, ChevronRight, GeoWebLogo, HamburgerMenu, Admin, useThemeContext, ThemeTypes, ArrowLeft, ArrowRight, KeyOption, KeyCommand, ArrowUp, ArrowDown, ChevronDown, Search, Clear, Cached } from '@opengeoweb/theme';
+import { Resize, BORDER_RADIUS, Options, Close, ChevronLeft, Exclamation, Success, Info, ChevronRight, GeoWebLogo, HamburgerMenu, Admin, useThemeContext, ThemeTypes, ArrowLeft, ArrowRight, KeyOption, KeyCommand, ArrowUp, ArrowDown, ChevronDown, Search, Clear, Cached, Filter as Filter$1 } from '@opengeoweb/theme';
 import { throttle, merge, escapeRegExp, debounce } from 'lodash';
 import { addIntegration } from '@sentry/react';
 import { parseISO, parse, format, isEqual, add as add$1, sub as sub$1, differenceInYears as differenceInYears$1, differenceInMonths as differenceInMonths$1, differenceInDays as differenceInDays$1, differenceInMinutes as differenceInMinutes$1, differenceInHours as differenceInHours$1, differenceInSeconds as differenceInSeconds$1, roundToNearestMinutes as roundToNearestMinutes$1, isBefore as isBefore$1, isAfter as isAfter$1, isValid as isValid$1, getUnixTime, fromUnixTime, set as set$1, getHours as getHours$1, startOfDay, addMinutes, addHours, setSeconds as setSeconds$1, getDay, getDayOfYear, getMonth, getWeek, getYear, isWithinInterval } from 'date-fns';
@@ -53,6 +53,11 @@ var en = {
 	"shared-shortcut-mouse-scroll": "+ Mouse scroll",
 	"shared-shortcut-or": "or",
 	"shared-shortcut-toggle-workspace-time-scroll": "Toggle workspace time scroll ON and OFF",
+	"shared-shortcut-open-location-search": "Open location search",
+	"shared-shortcut-zoom-to-location": "Zoom map to location",
+	"shared-shortcut-mouse-click": "+ Mouse click",
+	"shared-shortcut-split-button": "click split window button",
+	"shared-shortcut-copy-view-preset-content-split-window": "Copy over viewpreset content when splitting window",
 	"shared-sentry-recording": "Sentry Recording",
 	"shared-sentry-information": "For monitoring performance and errors, GeoWeb is logging usage information. In this process, no sensitive user information will leave the browser.",
 	"shared-sentry-enable-message": "By enabling recording I understand that the recording related data will be send to Sentry´s servers for processing.",
@@ -75,7 +80,11 @@ var en = {
 	"shared-filter-shared-view-presets": "Shared presets",
 	"shared-filter-search": "Search",
 	"shared-only": "ONLY",
-	"shared-customdialog-back": "Back"
+	"shared-customdialog-back": "Back",
+	"shared-filter-hide-labels": "Close filter",
+	"shared-filter-show-labels": "Open filter",
+	"shared-shortcut-toggle-location-info": "Toggle location info dialog ON and OFF",
+	"shared-shortcut-toggle-measure-tool": "Toggle map measure tool ON and OFF"
 };
 var fi = {
 	"shared-choose-app-mode": "Sovelluksen väriteema",
@@ -119,6 +128,11 @@ var fi = {
 	"shared-shortcut-mouse-scroll": "+ hiiren rulla",
 	"shared-shortcut-or": "tai",
 	"shared-shortcut-toggle-workspace-time-scroll": "Aseta työtilan ajan scrollaus päälle tai pois päältä",
+	"shared-shortcut-open-location-search": "Avaa sijainnin haku",
+	"shared-shortcut-zoom-to-location": "Zoomaa kartta sijaintiin",
+	"shared-shortcut-mouse-click": "+ hiiren napsautus",
+	"shared-shortcut-split-button": "napsauta Jaa ikkuna -painiketta",
+	"shared-shortcut-copy-view-preset-content-split-window": "Kopioi näkymän sisältö, kun ikkuna jaetaan kahtia",
 	"shared-sentry-recording": "Sentry Tallennus",
 	"shared-sentry-information": "Geoweb tallentaa tietoja sovelluksen käytöstä monitoroidakseen suorituskykyä, sekä virhetilanteita. Arkaluonteista dataa ei kerätä tai lähetetä.",
 	"shared-sentry-enable-message": "Ymmärrän, että laittamalla tallennuksen päälle tallennukseen liittyvää dataa lähetetään Sentryn palvelimille.",
@@ -141,7 +155,9 @@ var fi = {
 	"shared-filter-shared-view-presets": "ei käännetty",
 	"shared-filter-search": "Etsi",
 	"shared-only": "Pelkästään",
-	"shared-customdialog-back": "PALAA TAKAISIN"
+	"shared-customdialog-back": "PALAA TAKAISIN",
+	"shared-filter-hide-labels": "Hide labels",
+	"shared-filter-show-labels": "Show labels"
 };
 var no = {
 	"shared-choose-app-mode": "Velg din standardmodus",
@@ -185,6 +201,11 @@ var no = {
 	"shared-shortcut-mouse-scroll": "+ skroll",
 	"shared-shortcut-or": "eller",
 	"shared-shortcut-toggle-workspace-time-scroll": "ikke oversatt",
+	"shared-shortcut-open-location-search": "Åpne stedsøk",
+	"shared-shortcut-zoom-to-location": "Zoom kart til sted",
+	"shared-shortcut-mouse-click": "+ museklikk",
+	"shared-shortcut-copy-view-preset-content-split-window": "kopier over viewpreset innhold når vindu deles",
+	"shared-shortcut-split-button": "trykk del vindu knapp",
 	"shared-sentry-recording": "Skjermopptak av Sentry",
 	"shared-sentry-information": "GeoWeb tar opp brukerinformasjon for å monitorere ytelse og feilmeldinger. Underveis vil ingen sensitiv brukerinformasjon forlate nettleser.",
 	"shared-sentry-enable-message": "Ved å bruke skjermopptak forstår jeg at opptaksdata vil bli sendt til Sentry for analysering",
@@ -207,7 +228,9 @@ var no = {
 	"shared-filter-shared-view-presets": "Delte snarveier",
 	"shared-filter-search": "Søk",
 	"shared-only": "BARE",
-	"shared-customdialog-back": "Tilbake"
+	"shared-customdialog-back": "Tilbake",
+	"shared-filter-hide-labels": "Skjul nøkkelord",
+	"shared-filter-show-labels": "Vis nøkkelord"
 };
 var nl = {
 	"shared-choose-app-mode": "Kies je standaard app-modus",
@@ -250,7 +273,12 @@ var nl = {
 	"shared-shortcut-home": "Home",
 	"shared-shortcut-mouse-scroll": "+ Scroll",
 	"shared-shortcut-or": "of",
-	"shared-shortcut-toggle-workspace-time-scroll": "niet vertaald",
+	"shared-shortcut-copy-view-preset-content-split-window": "Kopieer viewpreset instellingen naar nieuw paneel",
+	"shared-shortcut-split-button": "klik splits paneel knop",
+	"shared-shortcut-toggle-workspace-time-scroll": "Zet workspace tijd scrollen AAN en UIT",
+	"shared-shortcut-open-location-search": "Open locatie zoeken",
+	"shared-shortcut-zoom-to-location": "Zoom kaart naar locatie",
+	"shared-shortcut-mouse-click": "+ Muisklik",
 	"shared-sentry-recording": "Sentry Opname",
 	"shared-sentry-information": "Om performance en fouten te monitoren, registreert GeoWeb gebruiksinformatie. Tijdens dit proces verlaat geen enkele gevoelige gebruikersinformatie de browser.",
 	"shared-sentry-enable-message": "Door opname te starten, ga ik akkoord dat de opnamegerelateerde gegevens ter verwerking naar de servers van Sentry worden verzonden.",
@@ -273,7 +301,11 @@ var nl = {
 	"shared-filter-shared-view-presets": "Gedeelde presets",
 	"shared-filter-search": "Zoeken",
 	"shared-only": "ALLEEN",
-	"shared-customdialog-back": "Terug"
+	"shared-customdialog-back": "Terug",
+	"shared-filter-hide-labels": "Verberg labels",
+	"shared-filter-show-labels": "Toon labels",
+	"shared-shortcut-toggle-location-info": "Zet locatie informatie AAN en UIT",
+	"shared-shortcut-toggle-measure-tool": "Zet meten op de kaart AAN en UIT"
 };
 var sharedTranslations = {
 	en: en,
@@ -881,7 +913,7 @@ var CustomTooltip = function CustomTooltip(props) {
   }));
 };
 
-var _excluded$b = ["tooltipTitle", "variant", "isSelected", "shouldShowAsDisabled", "size", "children", "className", "tooltipProps"];
+var _excluded$b = ["tooltipTitle", "variant", "isSelected", "shouldShowAsDisabled", "size", "children", "className", "tooltipProps", "shouldShowExtraOptionsIndicator", "optionsActive"];
 var CustomIconButtonNoMemo = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _defaultTooltipProps$;
   var _ref$tooltipTitle = _ref.tooltipTitle,
@@ -897,6 +929,10 @@ var CustomIconButtonNoMemo = /*#__PURE__*/React.forwardRef(function (_ref, ref)
     children = _ref.children,
     className = _ref.className,
     defaultTooltipProps = _ref.tooltipProps,
+    _ref$shouldShowExtraO = _ref.shouldShowExtraOptionsIndicator,
+    shouldShowExtraOptionsIndicator = _ref$shouldShowExtraO === void 0 ? false : _ref$shouldShowExtraO,
+    _ref$optionsActive = _ref.optionsActive,
+    optionsActive = _ref$optionsActive === void 0 ? false : _ref$optionsActive,
     props = _objectWithoutPropertiesLoose(_ref, _excluded$b);
   var classNames = [].concat(className ? [className] : [], isSelected ? ['Mui-selected'] : [], [variant]).join(' ');
   var tooltipTitle = (_defaultTooltipProps$ = defaultTooltipProps == null ? void 0 : defaultTooltipProps.title) != null ? _defaultTooltipProps$ : defaultTooltipTitle;
@@ -911,7 +947,7 @@ var CustomIconButtonNoMemo = /*#__PURE__*/React.forwardRef(function (_ref, ref)
     });
   }, [defaultTooltipProps, tooltipTitle]);
   var renderIconButton = function renderIconButton() {
-    return jsx(IconButton, Object.assign({
+    return jsxs(IconButton, Object.assign({
       "aria-label": tooltipTitle
     }, props, {
       "aria-pressed": isSelected,
@@ -926,7 +962,19 @@ var CustomIconButtonNoMemo = /*#__PURE__*/React.forwardRef(function (_ref, ref)
           color: "geowebColors.iconButtons." + variant + ".default.color"
         }
       }),
-      children: children
+      children: [children, shouldShowExtraOptionsIndicator ? jsx(Box, {
+        "data-testid": "extra-options-indicator",
+        sx: {
+          position: 'absolute',
+          right: -1,
+          bottom: -1,
+          color: optionsActive ? "geowebColors.iconButtons." + variant + ".active.fill" : 'inherit',
+          borderBottom: '8px solid',
+          borderLeft: '8px solid transparent',
+          borderBottomRightRadius: BORDER_RADIUS,
+          pointerEvents: 'none'
+        }
+      }) : null]
     }));
   };
   return tooltipTitle && !props.disabled ? jsx(CustomTooltip, Object.assign({}, tooltipProps, {
@@ -3569,6 +3617,66 @@ var ShortcutList = function ShortcutList(_ref) {
       type: "icon",
       children: "S"
     })
+  }, {
+    titleKey: 'shared-shortcut-open-location-search',
+    description: jsx(ShortCutSegment, {
+      type: "icon",
+      children: "F"
+    }),
+    descriptionMac: jsx(ShortCutSegment, {
+      type: "icon",
+      children: "F"
+    })
+  }, {
+    titleKey: 'shared-shortcut-zoom-to-location',
+    description: jsxs(Fragment, {
+      children: [jsx(ShortCutSegment, {
+        type: "icon",
+        children: "Shift"
+      }), jsxs(ShortCutSegment, {
+        children: [" ", t('shared-shortcut-mouse-click')]
+      })]
+    }),
+    descriptionMac: jsxs(Fragment, {
+      children: [jsx(ShortCutSegment, {
+        type: "icon",
+        children: "Shift"
+      }), jsxs(ShortCutSegment, {
+        children: [" ", t('shared-shortcut-mouse-click')]
+      })]
+    })
+  }, {
+    titleKey: 'shared-shortcut-copy-view-preset-content-split-window',
+    description: jsxs(Fragment, {
+      children: [jsx(ShortCutSegment, {
+        type: "icon",
+        children: "Shift"
+      }), jsx(ShortCutSegment, {
+        children: " + "
+      }), jsx(ShortCutSegment, {
+        children: t('shared-shortcut-split-button')
+      })]
+    })
+  }, {
+    titleKey: 'shared-shortcut-toggle-location-info',
+    description: jsx(ShortCutSegment, {
+      type: "icon",
+      children: "I"
+    }),
+    descriptionMac: jsx(ShortCutSegment, {
+      type: "icon",
+      children: "I"
+    })
+  }, {
+    titleKey: 'shared-shortcut-toggle-measure-tool',
+    description: jsx(ShortCutSegment, {
+      type: "icon",
+      children: "M"
+    }),
+    descriptionMac: jsx(ShortCutSegment, {
+      type: "icon",
+      children: "M"
+    })
   }];
   return jsx(List, {
     "data-testid": "list-" + platform,
@@ -5094,13 +5202,39 @@ var FilterChip = function FilterChip(_ref) {
   });
 };
 
+var FilterToggleButton = function FilterToggleButton(_ref) {
+  var _t, _t2;
+  var isOpen = _ref.isOpen,
+    onToggle = _ref.onToggle;
+  var _useSharedTranslation = useSharedTranslation(),
+    t = _useSharedTranslation.t;
+  var tooltipTitle = isOpen ? (_t = t('shared-filter-hide-labels')) != null ? _t : '' : (_t2 = t('shared-filter-show-labels')) != null ? _t2 : '';
+  return jsx(Tooltip, {
+    title: tooltipTitle,
+    children: jsx(CustomIconButton, {
+      "aria-pressed": isOpen,
+      "data-testid": "workspace-label-filter-toggle",
+      id: "labels-filter",
+      isSelected: isOpen,
+      onClick: onToggle,
+      variant: "tool",
+      children: jsx(Filter$1, {})
+    })
+  });
+};
+
 var FilterList = function FilterList(_ref) {
   var _ref$filters = _ref.filters,
     filters = _ref$filters === void 0 ? [] : _ref$filters,
     _ref$onChipClick = _ref.onChipClick,
     onChipClick = _ref$onChipClick === void 0 ? function () {} : _ref$onChipClick,
     _ref$isAllSelected = _ref.isAllSelected,
-    isAllSelected = _ref$isAllSelected === void 0 ? false : _ref$isAllSelected;
+    isAllSelected = _ref$isAllSelected === void 0 ? false : _ref$isAllSelected,
+    _ref$showLabelFilterT = _ref.showLabelFilterToggle,
+    showLabelFilterToggle = _ref$showLabelFilterT === void 0 ? false : _ref$showLabelFilterT,
+    _ref$isLabelFilterOpe = _ref.isLabelFilterOpen,
+    isLabelFilterOpen = _ref$isLabelFilterOpe === void 0 ? false : _ref$isLabelFilterOpe,
+    onToggleLabelFilter = _ref.onToggleLabelFilter;
   var _useSharedTranslation = useSharedTranslation(),
     t = _useSharedTranslation.t;
   return jsxs(Stack, {
@@ -5110,9 +5244,13 @@ var FilterList = function FilterList(_ref) {
     flexWrap: "wrap",
     sx: {
       gap: 1,
-      rowGap: 1
+      rowGap: 1,
+      alignItems: 'center'
     },
-    children: [jsx(FilterChip, {
+    children: [showLabelFilterToggle && onToggleLabelFilter ? jsx(FilterToggleButton, {
+      isOpen: isLabelFilterOpen,
+      onToggle: onToggleLabelFilter
+    }) : null, jsx(FilterChip, {
       handleClick: function handleClick(key) {
         return onChipClick(key, !isAllSelected);
       },
@@ -5201,7 +5339,7 @@ var SearchField = function SearchField(_ref3) {
   });
 };
 
-var _excluded$1 = ["filters", "onClickFilterChip", "onSearch", "isAllSelected", "searchQuery"];
+var _excluded$1 = ["filters", "onClickFilterChip", "onSearch", "isAllSelected", "searchQuery", "showLabelFilterToggle", "isLabelFilterOpen", "onToggleLabelFilter", "showSearchField"];
 var DEFAULT_FILTER_HEIGHT = 85;
 var Filter = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var filters = _ref.filters,
@@ -5210,7 +5348,13 @@ var Filter = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     _ref$onSearch = _ref.onSearch,
     onSearch = _ref$onSearch === void 0 ? function () {} : _ref$onSearch,
     isAllSelected = _ref.isAllSelected,
-    searchQuery = _ref.searchQuery,
+    searchQuery = _ref.searchQuery;
+    _ref.showLabelFilterToggle;
+    var _ref$isLabelFilterOpe = _ref.isLabelFilterOpen,
+    isLabelFilterOpen = _ref$isLabelFilterOpe === void 0 ? false : _ref$isLabelFilterOpe,
+    onToggleLabelFilter = _ref.onToggleLabelFilter,
+    _ref$showSearchField = _ref.showSearchField,
+    showSearchField = _ref$showSearchField === void 0 ? true : _ref$showSearchField,
     props = _objectWithoutPropertiesLoose(_ref, _excluded$1);
   return jsx(Box, {
     ref: ref,
@@ -5220,13 +5364,16 @@ var Filter = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     }, Array.isArray(props.sx) ? Object.assign.apply(Object, [{}].concat(props.sx)) : props.sx),
     children: jsxs(Stack, {
       spacing: 1,
-      children: [jsx(SearchField, {
+      children: [showSearchField ? jsx(SearchField, {
         value: searchQuery,
         valueChanged: onSearch
-      }), jsx(FilterList, {
+      }) : null, jsx(FilterList, {
         filters: filters,
         isAllSelected: isAllSelected,
-        onChipClick: onClickFilterChip
+        isLabelFilterOpen: isLabelFilterOpen,
+        onChipClick: onClickFilterChip,
+        onToggleLabelFilter: onToggleLabelFilter,
+        showLabelFilterToggle: true
       })]
     })
   });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/shared",
-  "version": "14.3.0",
+  "version": "14.4.0",
   "description": "GeoWeb shared library with shared components and utils for the opengeoweb project",
   "license": "Apache-2.0",
   "repository": {
@@ -8,7 +8,7 @@
     "url": "git@gitlab.com:opengeoweb/opengeoweb.git"
   },
   "dependencies": {
-    "@opengeoweb/theme": "14.3.0",
+    "@opengeoweb/theme": "14.4.0",
     "react-draggable": "^4.4.6",
     "re-resizable": "^6.9.11",
     "lodash": "^4.17.21",

package/src/lib/components/CustomIconButton/CustomIconButton.d.ts

@@ -8,6 +8,8 @@ export interface CustomIconProps extends IconButtonProps {
     isSelected?: boolean;
     shouldShowAsDisabled?: boolean;
     tooltipProps?: TooltipProps;
+    shouldShowExtraOptionsIndicator?: boolean;
+    optionsActive?: boolean;
 }
 export declare const CustomIconButton: React.MemoExoticComponent<React.ForwardRefExoticComponent<Omit<CustomIconProps, "ref"> & React.RefAttributes<HTMLButtonElement>>>;
 export {};

package/src/lib/components/Filter/Filter.d.ts

@@ -8,6 +8,10 @@ interface FilterProps extends BoxProps {
     onSearch?: (value: string) => void;
     isAllSelected?: boolean;
     searchQuery?: string;
+    showLabelFilterToggle?: boolean;
+    isLabelFilterOpen?: boolean;
+    onToggleLabelFilter?: () => void;
+    showSearchField?: boolean;
 }
 declare const Filter: React.ForwardRefExoticComponent<Omit<FilterProps, "ref"> & React.RefAttributes<HTMLElement>>;
 export default Filter;

package/src/lib/components/Filter/FilterList.d.ts

@@ -10,6 +10,9 @@ interface FilterListProps {
     filters?: ListFilter[];
     onChipClick?: (id: string, selected: boolean) => void;
     isAllSelected?: boolean;
+    showLabelFilterToggle?: boolean;
+    isLabelFilterOpen?: boolean;
+    onToggleLabelFilter?: () => void;
 }
 declare const FilterList: React.FC<FilterListProps>;
 export default FilterList;

package/src/lib/components/Filter/FilterToggleButton.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export declare const FilterToggleButton: React.FC<{
+    isOpen: boolean;
+    onToggle: () => void;
+}>;