@opengeoweb/layer-select 12.1.1 → 12.2.0

package/index.esm.js

@@ -2,18 +2,18 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as React from 'react';
 import React__default from 'react';
 import { useSelector, useDispatch } from 'react-redux';
-import { CustomIconButton, FilterOption, ToolContainerDraggable, CustomAccordion, CustomToggleButton, CustomTooltip, SearchHighlight, SearchField, ToggleMenu } from '@opengeoweb/shared';
-import { Filter, LayersAdd, Add, Cached, Edit, Visibility, Delete, Close, Copy } from '@opengeoweb/theme';
-import { uiTypes, serviceActions, selectorMemoizationOptions, serviceSelectors, uiActions, getUserAddedServices, setUserAddedServices, layerActions, uiSelectors, layerSelectors, mapListener, serviceListener, layersListener, mapReducer, serviceReducer, layerReducer, uiReducer, useSetupDialog, mapSelectors, layerTypes } from '@opengeoweb/store';
+import { CustomIconButton, FilterOption, ToolContainerDraggable, CustomAccordion, CustomToggleButton, CustomTooltip, SearchHighlight, SearchField, ToggleMenu, CustomDialog } from '@opengeoweb/shared';
+import { Filter, LayersAdd, Add, Cached, Edit, Visibility, Delete, Copy } from '@opengeoweb/theme';
+import { uiTypes, serviceActions, selectorMemoizationOptions, serviceSelectors, uiActions, getUserAddedServices, setUserAddedServices, layerActions, uiSelectors, layerSelectors, mapListener, serviceListener, layersListener, uiReducer, layerReducer, serviceReducer, mapReducer, useSetupDialog, mapSelectors, layerTypes } from '@opengeoweb/store';
 import { createEntityAdapter, createSlice, createSelector, createListenerMiddleware, isAnyOf, combineReducers, configureStore } from '@reduxjs/toolkit';
 import { compact, countBy, partition } from 'lodash';
 import { snackbarListener, snackbarReducer, snackbarTypes, snackbarActions } from '@opengeoweb/snackbar';
-import { Switch, Grid2, List, Box, Typography, useTheme, Backdrop, CircularProgress, Button, ListItem, ListItemText, Dialog, DialogTitle, LinearProgress, DialogContent, InputAdornment, DialogActions } from '@mui/material';
+import { Switch, Grid2, List, Box, Typography, useTheme, Backdrop, CircularProgress, Button, ListItem, ListItemText, LinearProgress, InputAdornment } from '@mui/material';
 import 'i18next';
 import { useTranslation } from 'react-i18next';
 import { FixedSizeList } from 'react-window';
 import { getDimensionsList, LayerInfoButton } from '@opengeoweb/webmap-react';
-import { webmapUtils, LayerType, getWMSServiceId, queryWMSServiceInfo, queryWMSLayers, invalidateWMSGetCapabilities, clearImageCacheForAllMaps } from '@opengeoweb/webmap';
+import { LayerType, webmapUtils, getWMSServiceId, queryWMSServiceInfo, queryWMSLayers, invalidateWMSGetCapabilities, clearImageCacheForAllMaps } from '@opengeoweb/webmap';
 import { ReactHookFormProvider, defaultFormOptions, ReactHookFormTextField } from '@opengeoweb/form-fields';
 import { useFormContext } from 'react-hook-form';
 
@@ -741,9 +741,9 @@ function _regeneratorRuntime() {
   function define(t, e, r) {
     return Object.defineProperty(t, e, {
       value: r,
-      enumerable: !0,
-      configurable: !0,
-      writable: !0
+      enumerable: true,
+      configurable: true,
+      writable: true
     }), t[e];
   }
   try {
@@ -836,7 +836,7 @@ function _regeneratorRuntime() {
         if ("throw" === i) throw a;
         return {
           value: t,
-          done: !0
+          done: true
         };
       }
       for (n.method = i, n.arg = a;;) {
@@ -887,7 +887,7 @@ function _regeneratorRuntime() {
   function Context(t) {
     this.tryEntries = [{
       tryLoc: "root"
-    }], t.forEach(pushTryEntry, this), this.reset(!0);
+    }], t.forEach(pushTryEntry, this), this.reset(true);
   }
   function values(e) {
     if (e || "" === e) {
@@ -897,8 +897,8 @@ function _regeneratorRuntime() {
       if (!isNaN(e.length)) {
         var o = -1,
           i = function next() {
-            for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next;
-            return next.value = t, next.done = !0, next;
+            for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = false, next;
+            return next.value = t, next.done = true, next;
           };
         return i.next = i;
       }
@@ -907,10 +907,10 @@ function _regeneratorRuntime() {
   }
   return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", {
     value: GeneratorFunctionPrototype,
-    configurable: !0
+    configurable: true
   }), o(GeneratorFunctionPrototype, "constructor", {
     value: GeneratorFunction,
-    configurable: !0
+    configurable: true
   }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) {
     var e = "function" == typeof t && t.constructor;
     return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name));
@@ -939,17 +939,17 @@ function _regeneratorRuntime() {
     return r.reverse(), function next() {
       for (; r.length;) {
         var t = r.pop();
-        if (t in e) return next.value = t, next.done = !1, next;
+        if (t in e) return next.value = t, next.done = false, next;
       }
-      return next.done = !0, next;
+      return next.done = true, next;
     };
   }, e.values = values, Context.prototype = {
     constructor: Context,
     reset: function (e) {
-      if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t);
+      if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = false, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t);
     },
     stop: function () {
-      this.done = !0;
+      this.done = true;
       var t = this.tryEntries[0].completion;
       if ("throw" === t.type) throw t.arg;
       return this.rval;
@@ -968,10 +968,10 @@ function _regeneratorRuntime() {
           var c = n.call(i, "catchLoc"),
             u = n.call(i, "finallyLoc");
           if (c && u) {
-            if (this.prev < i.catchLoc) return handle(i.catchLoc, !0);
+            if (this.prev < i.catchLoc) return handle(i.catchLoc, true);
             if (this.prev < i.finallyLoc) return handle(i.finallyLoc);
           } else if (c) {
-            if (this.prev < i.catchLoc) return handle(i.catchLoc, !0);
+            if (this.prev < i.catchLoc) return handle(i.catchLoc, true);
           } else {
             if (!u) throw Error("try statement without catch or finally");
             if (this.prev < i.finallyLoc) return handle(i.finallyLoc);
@@ -2912,177 +2912,150 @@ var ServicePopupUnwrapped = function ServicePopupUnwrapped(_ref2) {
   var isSubmitDisabled = getFormHasformErrors() || getFormAreRequiredFieldsEmpty();
   var isShowPopup = servicePopupVariant === 'show';
   var isServiceUrlDisabled = isShowPopup || servicePopupVariant === 'edit';
-  return jsx(Dialog, {
+  return jsx(CustomDialog, {
     open: isOpen,
     hideBackdrop: hideBackdrop,
     fullWidth: true,
     maxWidth: "xs",
     "data-testid": "servicePopup",
+    title: getTitleForVariant(t, servicePopupVariant),
     sx: {
       '& .MuiDialog-paper': {
         backgroundColor: "geowebColors.cards.cardContainer",
         maxWidth: 458
       }
     },
+    onClose: function onClose() {
+      return closePopup && closePopup();
+    },
+    actions: isShowPopup ? jsx(Button, {
+      onClick: function onClick() {
+        return closePopup();
+      },
+      variant: "tertiary",
+      sx: {
+        width: {
+          xs: '100%',
+          sm: '117px'
+        }
+      },
+      children: t('close')
+    }) : jsxs(Fragment, {
+      children: [jsx(Button, {
+        onClick: closePopup,
+        "data-testid": "closePopupButtonCancel",
+        variant: "tertiary",
+        sx: {
+          width: {
+            xs: '100%',
+            sm: '117px'
+          }
+        },
+        children: t('cancel')
+      }), jsx(Button, {
+        type: "submit",
+        variant: "primary",
+        form: "servicePopupForm",
+        disabled: isSubmitDisabled || isLoading,
+        "data-testid": "saveServiceButton",
+        sx: {
+          marginLeft: {
+            xs: '0px!important',
+            sm: '8px!important'
+          },
+          width: {
+            xs: '100%',
+            sm: '117px'
+          }
+        },
+        children: t('save')
+      })]
+    }),
     children: jsxs("form", {
+      id: "servicePopupForm",
       onSubmit: handleSubmit(function (formValues) {
         return addNewService(formValues);
       }),
-      children: [jsxs(DialogTitle, {
+      children: [isLoading && jsx(Box, {
         sx: {
-          alignItems: 'center',
-          padding: '16px 16px 24px 16px'
+          position: 'relative'
         },
-        children: [jsxs(Box, {
+        children: jsx(LinearProgress, {
+          "data-testid": "loadingIndicator",
+          color: "secondary",
           sx: {
-            display: 'flex',
-            justifyContent: 'space-between',
-            alignItems: 'center',
-            ' span': {
-              fontSize: '1rem',
-              fontWeight: 500,
-              fontStyle: 'normal',
-              lineHeight: '1.38',
-              letterSpacing: '0.12px'
-            }
-          },
-          children: [jsx(Typography, {
-            variant: "h5",
-            component: "span",
-            children: getTitleForVariant(t, servicePopupVariant)
-          }), jsx(CustomIconButton, {
-            "aria-label": "close",
-            onClick: closePopup,
-            "data-testid": "closePopupButtonCross",
-            sx: {
-              marginTop: 'auto',
-              marginBottom: 'auto',
-              '&.MuiButtonBase-root': {
-                color: 'geowebColors.greys.accessible'
-              }
-            },
-            children: jsx(Close, {})
-          })]
-        }), isLoading && jsx(Box, {
-          sx: {
-            position: 'relative'
-          },
-          children: jsx(LinearProgress, {
-            "data-testid": "loadingIndicator",
-            color: "secondary",
-            sx: {
-              position: 'absolute',
-              width: '100%',
-              top: 8
-            }
+            position: 'absolute',
+            width: '100%',
+            top: 8
+          }
+        })
+      }), jsx(ReactHookFormTextField, {
+        name: FormFields.serviceUrl,
+        label: t('service-url-label'),
+        onFocus: onFocusServiceUrl,
+        autoFocus: !shouldDisableAutoFocus,
+        onBlur: onBlurServiceUrl,
+        onKeyDown: onKeyDownServiceUrl,
+        sx: style.textField,
+        rules: {
+          required: true,
+          validate: Object.assign({}, !isServiceUrlDisabled && {
+            onValidateServiceUrl: onValidateServiceUrl
           })
-        })]
-      }), jsxs(DialogContent, {
-        sx: {
-          padding: '8px 16px'
         },
-        children: [jsx(ReactHookFormTextField, {
-          name: FormFields.serviceUrl,
-          label: t('service-url-label'),
-          onFocus: onFocusServiceUrl,
-          autoFocus: !shouldDisableAutoFocus,
-          onBlur: onBlurServiceUrl,
-          onKeyDown: onKeyDownServiceUrl,
-          sx: style.textField,
-          rules: {
-            required: true,
-            validate: Object.assign({}, !isServiceUrlDisabled && {
-              onValidateServiceUrl: onValidateServiceUrl
+        disabled: isServiceUrlDisabled || isLoading,
+        isReadOnly: isShowPopup,
+        inputSlotProps: {
+          disableUnderline: isShowPopup,
+          endAdornment: isShowPopup && jsx(InputAdornment, {
+            position: "end",
+            children: jsx(CustomIconButton, {
+              "aria-label": "copy url",
+              onClick: function onClick() {
+                void navigator.clipboard.writeText(serviceUrl);
+                showSnackbar(t('copy-url-message'));
+              },
+              sx: {
+                marginTop: 0.5
+              },
+              children: jsx(Copy, {})
             })
-          },
-          disabled: isServiceUrlDisabled || isLoading,
-          isReadOnly: isShowPopup,
-          inputSlotProps: {
-            disableUnderline: isShowPopup,
-            endAdornment: isShowPopup && jsx(InputAdornment, {
-              position: "end",
-              children: jsx(CustomIconButton, {
-                "aria-label": "copy url",
-                onClick: function onClick() {
-                  void navigator.clipboard.writeText(serviceUrl);
-                  showSnackbar(t('copy-url-message'));
-                },
-                sx: {
-                  marginTop: 0.5
-                },
-                children: jsx(Copy, {})
-              })
-            })
-          },
-          defaultValue: serviceUrl
-        }), jsx(ReactHookFormTextField, {
-          name: FormFields.serviceName,
-          label: t('service-name-label'),
-          rules: {
-            required: true,
-            validate: {
-              onValidateServiceName: onValidateServiceName
-            }
-          },
-          disabled: isShowPopup || isLoading,
-          isReadOnly: isShowPopup,
-          inputSlotProps: {
-            disableUnderline: isShowPopup
-          },
-          sx: style.textField,
-          defaultValue: serviceName
-        }), jsx(ReactHookFormTextField, {
-          multiline: true,
-          rows: 4,
-          name: FormFields.serviceAbstracts,
-          label: t('service-abstracts-label'),
-          disabled: isShowPopup || isLoading,
-          isReadOnly: isShowPopup,
-          inputSlotProps: {
-            disableUnderline: isShowPopup
-          },
-          helperText: !isShowPopup ? t('service-popup-helper-text') : '',
-          sx: style.textField,
-          defaultValue: ""
-        }), !isServiceUrlDisabled && jsx(InitialValidationsTrigger, {
-          trigger: trigger,
-          getValues: getValues,
-          onValidField: fetchServiceData
-        })]
-      }), jsx(DialogActions, {
-        sx: {
-          padding: 2
+          })
         },
-        children: isShowPopup ? jsx(Button, {
-          onClick: function onClick() {
-            return closePopup();
-          },
-          variant: "tertiary",
-          sx: {
-            width: '117px'
-          },
-          children: t('close')
-        }) : jsxs(Fragment, {
-          children: [jsx(Button, {
-            onClick: closePopup,
-            "data-testid": "closePopupButtonCancel",
-            variant: "tertiary",
-            sx: {
-              width: '117px'
-            },
-            children: t('cancel')
-          }), jsx(Button, {
-            type: "submit",
-            variant: "primary",
-            disabled: isSubmitDisabled || isLoading,
-            "data-testid": "saveServiceButton",
-            sx: {
-              width: '117px',
-              marginLeft: '16px!important'
-            },
-            children: t('save')
-          })]
-        })
+        defaultValue: serviceUrl
+      }), jsx(ReactHookFormTextField, {
+        name: FormFields.serviceName,
+        label: t('service-name-label'),
+        rules: {
+          required: true,
+          validate: {
+            onValidateServiceName: onValidateServiceName
+          }
+        },
+        disabled: isShowPopup || isLoading,
+        isReadOnly: isShowPopup,
+        inputSlotProps: {
+          disableUnderline: isShowPopup
+        },
+        sx: style.textField,
+        defaultValue: serviceName
+      }), jsx(ReactHookFormTextField, {
+        multiline: true,
+        rows: 4,
+        name: FormFields.serviceAbstracts,
+        label: t('service-abstracts-label'),
+        disabled: isShowPopup || isLoading,
+        isReadOnly: isShowPopup,
+        inputSlotProps: {
+          disableUnderline: isShowPopup
+        },
+        helperText: !isShowPopup ? t('service-popup-helper-text') : '',
+        sx: style.textField,
+        defaultValue: ""
+      }), !isServiceUrlDisabled && jsx(InitialValidationsTrigger, {
+        trigger: trigger,
+        getValues: getValues,
+        onValidField: fetchServiceData
       })]
     })
   });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/layer-select",
-  "version": "12.1.1",
+  "version": "12.2.0",
   "description": "GeoWeb layer select library for the opengeoweb project",
   "license": "Apache-2.0",
   "repository": {
@@ -8,15 +8,15 @@
     "url": "git@gitlab.com:opengeoweb/opengeoweb.git"
   },
   "dependencies": {
-    "@opengeoweb/shared": "12.1.1",
-    "@opengeoweb/store": "12.1.1",
+    "@opengeoweb/shared": "12.2.0",
+    "@opengeoweb/store": "12.2.0",
     "react-redux": "^8.1.3",
-    "@opengeoweb/theme": "12.1.1",
-    "@opengeoweb/webmap-react": "12.1.1",
-    "@opengeoweb/webmap": "12.1.1",
+    "@opengeoweb/theme": "12.2.0",
+    "@opengeoweb/webmap-react": "12.2.0",
+    "@opengeoweb/webmap": "12.2.0",
     "react-window": "^1.8.10",
-    "@opengeoweb/snackbar": "12.1.1",
-    "@opengeoweb/form-fields": "12.1.1",
+    "@opengeoweb/snackbar": "12.2.0",
+    "@opengeoweb/form-fields": "12.2.0",
     "react-hook-form": "^7.50.1",
     "@reduxjs/toolkit": "^1.9.7",
     "lodash": "^4.17.21",

package/src/lib/components/ServicePopup/ServicePopup.stories.d.ts

@@ -1,47 +1,12 @@
-import * as React from 'react';
 import type { Meta, StoryObj } from '@storybook/react';
 import { ServicePopup } from './ServicePopup';
 declare const meta: Meta<typeof ServicePopup>;
 export default meta;
 type Story = StoryObj<typeof ServicePopup>;
 export declare const Component: Story;
-export declare const ServicePopupAddLight: {
-    (): React.ReactElement;
-    tags: string[];
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
-export declare const ServicePopupAddDark: {
-    (): React.ReactElement;
-    tags: string[];
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
-export declare const ServicePopupShowLight: {
-    (): React.ReactElement;
-    tags: string[];
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
-export declare const ServicePopupShowDark: {
-    (): React.ReactElement;
-    tags: string[];
-    parameters: {
-        zeplinLink: {
-            name: string;
-            link: string;
-        }[];
-    };
-};
+export declare const ServicePopupAddLight: Story;
+export declare const ServicePopupAddDark: Story;
+export declare const ServicePopupShowLight: Story;
+export declare const ServicePopupShowDark: Story;
+export declare const ServicePopupEditLight: Story;
+export declare const ServicePopupEditDark: Story;