@pushwoosh/smart-components-kit 1.0.90 → 1.1.0

package/ExportCSV/ExportCsvBanner/ExportCsvBanner.js

@@ -1,4 +1,5 @@
-import React, { useCallback, useEffect } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect } from 'react';
 import { ExportResult, ProgressBar, Button } from '@pushwoosh/dumb-components';
 import { Color, ShapeRadius } from '@pushwoosh/kit-constants';
 import { Horizontal } from '@pushwoosh/kit-helpers';
@@ -97,57 +98,61 @@ export const ExportCsvBanner = ({
     resultSubTitle,
     progressTitle
   } = exportTask;
-  return React.createElement(Horizontal, {
+  return _jsxs(Horizontal, {
     "$padding": 8,
     "$alignItems": "center",
     "$border": `1px solid ${Color.DIVIDER}`,
     "$borderRadius": ShapeRadius.SECTION,
-    "$bgColor": Color.CLEAR
-  }, status === 'STATUS_SUCCESS' && React.createElement(ExportResult, {
-    type: "success",
-    title: lang({
-      message: 'SMART.EXPORT_CSV.SUCCESS_TITLE'
-    }),
-    subtitle: `${resultSubTitle} ${filename}`,
-    handleClose: handleClose,
-    rightSlot: React.createElement("a", {
-      href: `/api/v2/statistics/exportMessagesStatistics/download/${filename}`,
-      download: filename
-    }, React.createElement(Button, {
-      color: "secondary",
-      size: "compact",
-      icon: React.createElement(DownloadIcon, {
-        size: "small",
-        view: "filled"
+    "$bgColor": Color.CLEAR,
+    children: [status === 'STATUS_SUCCESS' && _jsx(ExportResult, {
+      type: "success",
+      title: lang({
+        message: 'SMART.EXPORT_CSV.SUCCESS_TITLE'
+      }),
+      subtitle: `${resultSubTitle} ${filename}`,
+      handleClose: handleClose,
+      rightSlot: _jsx("a", {
+        href: `/api/v2/statistics/exportMessagesStatistics/download/${filename}`,
+        download: filename,
+        children: _jsx(Button, {
+          color: "secondary",
+          size: "compact",
+          icon: _jsx(DownloadIcon, {
+            size: "small",
+            view: "filled"
+          }),
+          children: lang({
+            message: 'SMART.EXPORT_CSV.DOWNLOAD'
+          })
+        })
+      })
+    }), status === 'STATUS_PENDING' && (isKeepPageOpenWarning ? _jsx(ProgressBar, {
+      title: progressTitle,
+      percentValue: progress,
+      rightSlot: _jsx(Text, {
+        "$color": Color.WARNING,
+        "$variant": "h5",
+        "$uppercase": true,
+        children: lang({
+          message: 'SMART.EXPORT_CSV.KEEP_PAGE_OPEN'
+        })
       })
-    }, lang({
-      message: 'SMART.EXPORT_CSV.DOWNLOAD'
-    })))
-  }), status === 'STATUS_PENDING' && (isKeepPageOpenWarning ? React.createElement(ProgressBar, {
-    title: progressTitle,
-    percentValue: progress,
-    rightSlot: React.createElement(Text, {
-      "$color": Color.WARNING,
-      "$variant": "h5",
-      "$uppercase": true
-    }, lang({
-      message: 'SMART.EXPORT_CSV.KEEP_PAGE_OPEN'
-    }))
-  }) : React.createElement(ProgressBar, {
-    title: progressTitle,
-    percentValue: progress
-  })), status === 'STATUS_FAILED' && React.createElement(ExportResult, {
-    type: "error",
-    title: lang({
-      message: 'SMART.EXPORT_CSV.FAILED_TITLE'
-    }),
-    subtitle: lang({
-      message: 'SMART.EXPORT_CSV.FAILED_SUBTITLE'
-    }),
-    leftSlotIcon: React.createElement(DangerTriangleIcon, {
-      size: "medium",
-      view: "filled"
-    }),
-    handleClose: handleClose
-  }));
+    }) : _jsx(ProgressBar, {
+      title: progressTitle,
+      percentValue: progress
+    })), status === 'STATUS_FAILED' && _jsx(ExportResult, {
+      type: "error",
+      title: lang({
+        message: 'SMART.EXPORT_CSV.FAILED_TITLE'
+      }),
+      subtitle: lang({
+        message: 'SMART.EXPORT_CSV.FAILED_SUBTITLE'
+      }),
+      leftSlotIcon: _jsx(DangerTriangleIcon, {
+        size: "medium",
+        view: "filled"
+      }),
+      handleClose: handleClose
+    })]
+  });
 };

package/ExportCSV/useExportService/useExportService.js

@@ -60,6 +60,7 @@ export const useExportService = () => {
           if (retriesRef.current < MAX_RETRIES) {
             retriesRef.current += 1;
             timeoutStatusRef.current = setTimeout(() => {
+              // eslint-disable-next-line react-hooks/immutability
               getStatus(params);
               clearStatusTimeout();
             }, API_CHECK_INTERVAL);

package/LanguagesSelector/LanguagesModal.js

@@ -1,4 +1,5 @@
-import React, { useState } from 'react';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from 'react';
 import { Button, ModalHeader, ModalBody, ModalFooter, ModalTitle } from '@pushwoosh/dumb-components';
 import { Horizontal } from '@pushwoosh/kit-helpers';
 import { LanguagesSelectFormLoader } from './LanguagesSelectFormLoader';
@@ -12,27 +13,40 @@ export const LanguagesModal = ({
 }) => {
   const lang = useLang();
   const [selectedLanguages, setSelectedLanguages] = useState(initialLanguages);
-  return React.createElement(React.Fragment, null, React.createElement(ModalHeader, null, React.createElement(ModalTitle, null, lang({
-    message: 'SMART.LANGUAGES_SELECTOR.MODAL.TITLE'
-  }))), React.createElement(ModalBody, null, React.createElement(LanguagesSelectFormLoader, {
-    application: applicationCode,
-    onChange: setSelectedLanguages,
-    value: selectedLanguages
-  })), React.createElement(ModalFooter, null, React.createElement(Horizontal, {
-    "$justifyContent": "end",
-    "$gap": 8
-  }, React.createElement(Button, {
-    color: "secondary",
-    onClick: onClose
-  }, lang({
-    message: 'SMART.LANGUAGES_SELECTOR.BUTTON.CANCEL'
-  })), React.createElement(Button, {
-    color: "primary",
-    onClick: () => {
-      saveLastSelection(selectedLanguages);
-      onSubmit(selectedLanguages);
-    }
-  }, lang({
-    message: 'SMART.LANGUAGES_SELECTOR.BUTTON.APPLY'
-  })))));
+  return _jsxs(_Fragment, {
+    children: [_jsx(ModalHeader, {
+      children: _jsx(ModalTitle, {
+        children: lang({
+          message: 'SMART.LANGUAGES_SELECTOR.MODAL.TITLE'
+        })
+      })
+    }), _jsx(ModalBody, {
+      children: _jsx(LanguagesSelectFormLoader, {
+        application: applicationCode,
+        onChange: setSelectedLanguages,
+        value: selectedLanguages
+      })
+    }), _jsx(ModalFooter, {
+      children: _jsxs(Horizontal, {
+        "$justifyContent": "end",
+        "$gap": 8,
+        children: [_jsx(Button, {
+          color: "secondary",
+          onClick: onClose,
+          children: lang({
+            message: 'SMART.LANGUAGES_SELECTOR.BUTTON.CANCEL'
+          })
+        }), _jsx(Button, {
+          color: "primary",
+          onClick: () => {
+            saveLastSelection(selectedLanguages);
+            onSubmit(selectedLanguages);
+          },
+          children: lang({
+            message: 'SMART.LANGUAGES_SELECTOR.BUTTON.APPLY'
+          })
+        })]
+      })
+    })]
+  });
 };

package/LanguagesSelector/LanguagesSelectForm.js

@@ -1,4 +1,5 @@
-import React, { useMemo, useState } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from 'react';
 import { Checkbox, SearchInput } from '@pushwoosh/dumb-components';
 import { Columns, Horizontal, Vertical } from '@pushwoosh/kit-helpers';
 import { useLang } from './polyglot';
@@ -24,65 +25,75 @@ export const LanguagesSelectForm = ({
       return item.name.toLowerCase().includes(search.toLowerCase());
     });
   }, [allLanguageItems, search, showAllLanguages, langs]);
-  return React.createElement(Vertical, {
-    "$gap": 8
-  }, React.createElement(SearchInput, {
-    value: search,
-    onChange: e => setSearch(e.target.value),
-    "$onClear": () => setSearch(''),
-    placeholder: lang({
-      message: 'SMART.LANGUAGES_SELECTOR.SEARCH_PLACEHOLDER'
-    })
-  }), React.createElement(Horizontal, {
-    "$justifyContent": "space-between"
-  }, React.createElement(Horizontal, {
-    "$gap": 16,
-    "$justifyContent": "start"
-  }, React.createElement(ActionButton, {
-    onClick: () => {
-      onChange(filteredLanguages.map(item => item.code));
-    }
-  }, lang({
-    message: 'SMART.LANGUAGES_SELECTOR.ACTION.SELECT_ALL'
-  })), React.createElement(ActionButton, {
-    onClick: () => {
-      onChange([]);
-    }
-  }, lang({
-    message: 'SMART.LANGUAGES_SELECTOR.ACTION.DESELECT_ALL'
-  }))), lastSelection.length > 0 && React.createElement(ActionButton, {
-    onClick: () => {
-      onChange(lastSelection);
-    }
-  }, lang({
-    message: 'SMART.LANGUAGES_SELECTOR.ACTION.REUSE_LAST'
-  }))), React.createElement(Vertical, {
-    "$gap": 24
-  }, React.createElement(Columns, {
-    "$sizes": 3,
-    "$gap": 8
-  }, filteredLanguages.map(item => React.createElement(Checkbox, {
-    name: "languages",
-    value: item.code,
-    isChecked: langs.includes(item.code),
-    onChange: isChecked => {
-      if (isChecked) {
-        onChange([...langs, item.code]);
-      } else {
-        onChange(langs.filter(code => code !== item.code));
-      }
-    },
-    label: lang({
-      message: 'SMART.LANGUAGES_SELECTOR.CHECKBOX_LABEL',
-      name: getLangName(item.code),
-      subscribers: item.subscribers
-    }),
-    key: item.code
-  }))), React.createElement("div", null, React.createElement(ActionButton, {
-    onClick: () => setShowAllLanguages(x => !x)
-  }, showAllLanguages ? lang({
-    message: 'SMART.LANGUAGES_SELECTOR.ACTION.SHOW_WITH_SUBSCRIBERS'
-  }) : lang({
-    message: 'SMART.LANGUAGES_SELECTOR.ACTION.SHOW_ALL'
-  })))));
+  return _jsxs(Vertical, {
+    "$gap": 8,
+    children: [_jsx(SearchInput, {
+      value: search,
+      onChange: e => setSearch(e.target.value),
+      "$onClear": () => setSearch(''),
+      placeholder: lang({
+        message: 'SMART.LANGUAGES_SELECTOR.SEARCH_PLACEHOLDER'
+      })
+    }), _jsxs(Horizontal, {
+      "$justifyContent": "space-between",
+      children: [_jsxs(Horizontal, {
+        "$gap": 16,
+        "$justifyContent": "start",
+        children: [_jsx(ActionButton, {
+          onClick: () => {
+            onChange(filteredLanguages.map(item => item.code));
+          },
+          children: lang({
+            message: 'SMART.LANGUAGES_SELECTOR.ACTION.SELECT_ALL'
+          })
+        }), _jsx(ActionButton, {
+          onClick: () => {
+            onChange([]);
+          },
+          children: lang({
+            message: 'SMART.LANGUAGES_SELECTOR.ACTION.DESELECT_ALL'
+          })
+        })]
+      }), lastSelection.length > 0 && _jsx(ActionButton, {
+        onClick: () => {
+          onChange(lastSelection);
+        },
+        children: lang({
+          message: 'SMART.LANGUAGES_SELECTOR.ACTION.REUSE_LAST'
+        })
+      })]
+    }), _jsxs(Vertical, {
+      "$gap": 24,
+      children: [_jsx(Columns, {
+        "$sizes": 3,
+        "$gap": 8,
+        children: filteredLanguages.map(item => _jsx(Checkbox, {
+          name: "languages",
+          value: item.code,
+          isChecked: langs.includes(item.code),
+          onChange: isChecked => {
+            if (isChecked) {
+              onChange([...langs, item.code]);
+            } else {
+              onChange(langs.filter(code => code !== item.code));
+            }
+          },
+          label: lang({
+            message: 'SMART.LANGUAGES_SELECTOR.CHECKBOX_LABEL',
+            name: getLangName(item.code),
+            subscribers: item.subscribers
+          })
+        }, item.code))
+      }), _jsx("div", {
+        children: _jsx(ActionButton, {
+          onClick: () => setShowAllLanguages(x => !x),
+          children: showAllLanguages ? lang({
+            message: 'SMART.LANGUAGES_SELECTOR.ACTION.SHOW_WITH_SUBSCRIBERS'
+          }) : lang({
+            message: 'SMART.LANGUAGES_SELECTOR.ACTION.SHOW_ALL'
+          })
+        })
+      })]
+    })]
+  });
 };

package/LanguagesSelector/LanguagesSelectFormLoader.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { Spinner } from '@pushwoosh/dumb-components';
 import { Horizontal, useAsync } from '@pushwoosh/kit-helpers';
 import { useSPAContext } from '@pushwoosh/spa-context';
@@ -38,14 +38,15 @@ export const LanguagesSelectFormLoader = ({
     });
   }, [application, getLangName, systemLanguage]);
   if (langAsync.loading) {
-    return React.createElement(Horizontal, {
+    return _jsx(Horizontal, {
       "$placeItems": "center",
-      "$padding": 36
-    }, React.createElement(Spinner, {
-      size: "medium"
-    }));
+      "$padding": 36,
+      children: _jsx(Spinner, {
+        size: "medium"
+      })
+    });
   }
-  return React.createElement(LanguagesSelectForm, {
+  return _jsx(LanguagesSelectForm, {
     allLanguageItems: langAsync.value,
     langs: value,
     onChange: onChange,

package/LanguagesSelector/LanguagesSelector.js

@@ -1,4 +1,5 @@
-import React, { useMemo, useState } from 'react';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from 'react';
 import { Button, Modal, DropdownMenu, DropdownMenuItem, DropdownMenuSection } from '@pushwoosh/dumb-components';
 import { Horizontal } from '@pushwoosh/kit-helpers';
 import { ArrowIcon, ChevronIcon, LanguageIcon, PlusIcon } from '@pushwoosh/kit-icons';
@@ -23,84 +24,97 @@ export const LanguagesSelector = ({
     }));
     return ['default', ...sorted];
   }, [getLangName, languages]);
-  return React.createElement(Horizontal, {
-    "$gap": 8
-  }, React.createElement(DropdownMenu, {
-    isScrollable: true,
-    renderHandler: handlerProps => React.createElement(Button, {
-      style: {
-        minWidth: 200
-      },
-      color: "secondary",
-      icon: React.createElement(LanguageIcon, {
-        size: "medium",
-        view: "lined"
+  return _jsxs(Horizontal, {
+    "$gap": 8,
+    children: [_jsx(DropdownMenu, {
+      isScrollable: true,
+      renderHandler: handlerProps => _jsx(Button, {
+        style: {
+          minWidth: 200
+        },
+        color: "secondary",
+        icon: _jsx(LanguageIcon, {
+          size: "medium",
+          view: "lined"
+        }),
+        rightIcon: _jsx(ChevronIcon, {
+          size: "medium",
+          direction: "down"
+        }),
+        onClick: handlerProps.onClick,
+        boxRef: handlerProps.ref,
+        isOpen: handlerProps.isOpen,
+        isDisabled: isDisabled,
+        children: getLangName(value)
       }),
-      rightIcon: React.createElement(ChevronIcon, {
-        size: "medium",
-        direction: "down"
+      children: () => _jsxs(_Fragment, {
+        children: [_jsx(DropdownMenuSection, {
+          children: _jsx(DropdownMenuItem, {
+            onClick: () => setShowLanguagesModal(true),
+            children: lang({
+              message: 'SMART.LANGUAGES_SELECTOR.CHOOSE_LANGUAGES'
+            })
+          })
+        }), _jsx(DropdownMenuSection, {
+          children: sortedLanguages.map(code => _jsx(DropdownMenuItem, {
+            isActive: code === value,
+            onClick: () => onChange(code),
+            children: getLangName(code)
+          }, code))
+        })]
+      })
+    }), sortedLanguages.length > 1 && _jsxs(ButtonGroup, {
+      children: [_jsx(Button, {
+        color: "secondary",
+        isDisabled: isDisabled,
+        icon: _jsx(ArrowIcon, {
+          size: "medium",
+          direction: "left"
+        }),
+        onClick: () => {
+          const index = sortedLanguages.indexOf(value);
+          if (index > 0) {
+            onChange(sortedLanguages[index - 1]);
+          } else {
+            onChange(sortedLanguages[sortedLanguages.length - 1]);
+          }
+        }
+      }), _jsx(Button, {
+        color: "secondary",
+        isDisabled: isDisabled,
+        icon: _jsx(ArrowIcon, {
+          size: "medium",
+          direction: "right"
+        }),
+        onClick: () => {
+          const index = sortedLanguages.indexOf(value);
+          if (index < sortedLanguages.length - 1) {
+            onChange(sortedLanguages[index + 1]);
+          } else {
+            onChange(sortedLanguages[0]);
+          }
+        }
+      })]
+    }), sortedLanguages.length <= 1 && _jsx(Button, {
+      color: "secondary",
+      icon: _jsx(PlusIcon, {
+        size: "medium"
       }),
-      onClick: handlerProps.onClick,
-      boxRef: handlerProps.ref,
-      isOpen: handlerProps.isOpen,
-      isDisabled: isDisabled
-    }, getLangName(value))
-  }, () => React.createElement(React.Fragment, null, React.createElement(DropdownMenuSection, null, React.createElement(DropdownMenuItem, {
-    onClick: () => setShowLanguagesModal(true)
-  }, lang({
-    message: 'SMART.LANGUAGES_SELECTOR.CHOOSE_LANGUAGES'
-  }))), React.createElement(DropdownMenuSection, null, sortedLanguages.map(code => React.createElement(DropdownMenuItem, {
-    key: code,
-    isActive: code === value,
-    onClick: () => onChange(code)
-  }, getLangName(code)))))), sortedLanguages.length > 1 && React.createElement(ButtonGroup, null, React.createElement(Button, {
-    color: "secondary",
-    isDisabled: isDisabled,
-    icon: React.createElement(ArrowIcon, {
-      size: "medium",
-      direction: "left"
-    }),
-    onClick: () => {
-      const index = sortedLanguages.indexOf(value);
-      if (index > 0) {
-        onChange(sortedLanguages[index - 1]);
-      } else {
-        onChange(sortedLanguages[sortedLanguages.length - 1]);
-      }
-    }
-  }), React.createElement(Button, {
-    color: "secondary",
-    isDisabled: isDisabled,
-    icon: React.createElement(ArrowIcon, {
+      onClick: () => setShowLanguagesModal(true)
+    }), _jsx(Modal, {
       size: "medium",
-      direction: "right"
-    }),
-    onClick: () => {
-      const index = sortedLanguages.indexOf(value);
-      if (index < sortedLanguages.length - 1) {
-        onChange(sortedLanguages[index + 1]);
-      } else {
-        onChange(sortedLanguages[0]);
-      }
-    }
-  })), sortedLanguages.length <= 1 && React.createElement(Button, {
-    color: "secondary",
-    icon: React.createElement(PlusIcon, {
-      size: "medium"
-    }),
-    onClick: () => setShowLanguagesModal(true)
-  }), React.createElement(Modal, {
-    size: "medium",
-    isOpen: showLanguagesModal
-  }, React.createElement(LanguagesModal, {
-    applicationCode: applicationCode,
-    initialLanguages: languages,
-    onSubmit: langs => {
-      onChangeLanguages(langs);
-      setShowLanguagesModal(false);
-    },
-    onClose: () => {
-      setShowLanguagesModal(false);
-    }
-  })));
+      isOpen: showLanguagesModal,
+      children: _jsx(LanguagesModal, {
+        applicationCode: applicationCode,
+        initialLanguages: languages,
+        onSubmit: langs => {
+          onChangeLanguages(langs);
+          setShowLanguagesModal(false);
+        },
+        onClose: () => {
+          setShowLanguagesModal(false);
+        }
+      })
+    })]
+  });
 };