@pushwoosh/dumb-components 1.1.134 → 1.1.136

package/FrequencyCapping/helpers/getReadonlyCappingHelpers.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { Horizontal } from '@pushwoosh/kit-helpers';
 import { HelpRoundIcon } from '@pushwoosh/kit-icons';
 import { getCappingChipText } from './getCappingChipText';
@@ -9,42 +9,51 @@ import { CappingTypes } from '../types';
 export function getReadonlyCappingLabel(cappingOption, isGlobalCappingDisabled, capping, globalCapping, isInJourney, lang) {
   const tooltip = getReadonlyTooltip(cappingOption, isInJourney, lang);
   if (cappingOption === CappingTypes.CUSTOM) {
-    return React.createElement(React.Fragment, null, lang({
-      message: 'DUMB.FREQUENCY_CAPPING.RO.CUSTOM_LABEL'
-    }), React.createElement(ChipFrequencyCapping, {
-      text: getCappingChipText(lang, capping.messages, capping.days),
-      tooltip: tooltip
-    }));
+    return _jsxs(_Fragment, {
+      children: [lang({
+        message: 'DUMB.FREQUENCY_CAPPING.RO.CUSTOM_LABEL'
+      }), _jsx(ChipFrequencyCapping, {
+        text: getCappingChipText(lang, capping.messages, capping.days),
+        tooltip: tooltip
+      })]
+    });
   }
   if (cappingOption === CappingTypes.IGNORE) {
-    return React.createElement(Horizontal, {
+    return _jsxs(Horizontal, {
       "$alignItems": "center",
       "$gap": 4,
-      "$justifyContent": "start"
-    }, lang({
-      message: 'DUMB.FREQUENCY_CAPPING.RO.IGNORE_LABEL'
-    }), React.createElement(Tooltip, {
-      content: tooltip,
-      position: "top-middle"
-    }, React.createElement(IconWrapper, {
-      "$padding": "4px 0"
-    }, React.createElement(HelpRoundIcon, {
-      size: "small",
-      view: "lined"
-    }))));
+      "$justifyContent": "start",
+      children: [lang({
+        message: 'DUMB.FREQUENCY_CAPPING.RO.IGNORE_LABEL'
+      }), _jsx(Tooltip, {
+        content: tooltip,
+        position: "top-middle",
+        children: _jsx(IconWrapper, {
+          "$padding": "4px 0",
+          children: _jsx(HelpRoundIcon, {
+            size: "small",
+            view: "lined"
+          })
+        })
+      })]
+    });
   }
-  return isGlobalCappingDisabled ? React.createElement(React.Fragment, null, lang({
-    message: 'DUMB.FREQUENCY_CAPPING.RO.GLOBAL_LABEL'
-  }), React.createElement(ChipFrequencyCapping, {
-    text: getCappingChipText(lang, 0, 0)
-  }), lang({
-    message: 'DUMB.FREQUENCY_CAPPING.RO.BECAUSE_UNSET'
-  })) : React.createElement(React.Fragment, null, lang({
-    message: 'DUMB.FREQUENCY_CAPPING.RO.GLOBAL_LABEL'
-  }), React.createElement(ChipFrequencyCapping, {
-    text: getCappingChipText(lang, globalCapping.count, globalCapping.days),
-    tooltip: tooltip
-  }));
+  return isGlobalCappingDisabled ? _jsxs(_Fragment, {
+    children: [lang({
+      message: 'DUMB.FREQUENCY_CAPPING.RO.GLOBAL_LABEL'
+    }), _jsx(ChipFrequencyCapping, {
+      text: getCappingChipText(lang, 0, 0)
+    }), lang({
+      message: 'DUMB.FREQUENCY_CAPPING.RO.BECAUSE_UNSET'
+    })]
+  }) : _jsxs(_Fragment, {
+    children: [lang({
+      message: 'DUMB.FREQUENCY_CAPPING.RO.GLOBAL_LABEL'
+    }), _jsx(ChipFrequencyCapping, {
+      text: getCappingChipText(lang, globalCapping.count, globalCapping.days),
+      tooltip: tooltip
+    })]
+  });
 }
 function getReadonlyTooltip(cappingOption, isInJourney, lang) {
   if (cappingOption === CappingTypes.IGNORE) {

package/GetStartedPage/GetStartedPage.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Color } from '@pushwoosh/kit-constants';
 import { Vertical } from '@pushwoosh/kit-helpers';
 import { CheckRoundIcon, LockIcon } from '@pushwoosh/kit-icons';
@@ -14,29 +14,48 @@ export function GetStartedPage(props) {
     checkList = [],
     actions = null
   } = props;
-  return React.createElement(GradientBackground, null, React.createElement(Wrapper, null, React.createElement(ContentBox, null, React.createElement(Vertical, {
-    "$gap": 16
-  }, React.createElement(Vertical, {
-    "$gap": 4
-  }, React.createElement(H1, null, title), React.createElement(Paragraph, null, description)), !!checkList.length && React.createElement(UnorderedList, null, checkList.map(text => React.createElement(UnorderedListItem, {
-    key: `item-${text}`
-  }, React.createElement(UnorderedListIcon, null, React.createElement(CheckRoundIcon, {
-    color: Color.SUCCESS,
-    size: "small",
-    type: "fill",
-    view: "filled"
-  })), React.createElement(UnorderedListText, null, text))))), (helpText || actions) && React.createElement(Vertical, {
-    "$gap": 16
-  }, helpText && React.createElement(Banner, {
-    type: "info",
-    view: "ghost",
-    title: helpText,
-    icon: React.createElement(LockIcon, {
-      view: "filled",
-      size: "small"
+  return _jsx(GradientBackground, {
+    children: _jsxs(Wrapper, {
+      children: [_jsxs(ContentBox, {
+        children: [_jsxs(Vertical, {
+          "$gap": 16,
+          children: [_jsxs(Vertical, {
+            "$gap": 4,
+            children: [_jsx(H1, {
+              children: title
+            }), _jsx(Paragraph, {
+              children: description
+            })]
+          }), !!checkList.length && _jsx(UnorderedList, {
+            children: checkList.map(text => _jsxs(UnorderedListItem, {
+              children: [_jsx(UnorderedListIcon, {
+                children: _jsx(CheckRoundIcon, {
+                  color: Color.SUCCESS,
+                  size: "small",
+                  type: "fill",
+                  view: "filled"
+                })
+              }), _jsx(UnorderedListText, {
+                children: text
+              })]
+            }, `item-${text}`))
+          })]
+        }), (helpText || actions) && _jsxs(Vertical, {
+          "$gap": 16,
+          children: [helpText && _jsx(Banner, {
+            type: "info",
+            view: "ghost",
+            title: helpText,
+            icon: _jsx(LockIcon, {
+              view: "filled",
+              size: "small"
+            })
+          }), actions]
+        })]
+      }), _jsx(Image, {
+        alt: title,
+        src: image
+      })]
     })
-  }), actions)), React.createElement(Image, {
-    alt: title,
-    src: image
-  })));
+  });
 }

package/InputFile/InputFile.js

@@ -1,4 +1,5 @@
-import React, { useRef } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef } from 'react';
 import { Color } from '@pushwoosh/kit-constants';
 import { AttachmentIcon } from '@pushwoosh/kit-icons';
 import { Button } from '../Button';
@@ -49,39 +50,47 @@ export function InputFile({
     };
     reader.readAsDataURL(file);
   };
-  return React.createElement(FieldBox, {
+  return _jsxs(FieldBox, {
     title: label,
-    error: errorText
-  }, React.createElement(InputFileFieldsStyled, null, React.createElement(InputFileInputHiddenStyled, {
-    ref: fieldRef,
-    id: fileId,
-    type: "file",
-    disabled: disabled,
-    accept: accept,
-    onChange: uploadFile,
-    value: ""
-  }), React.createElement(InputFileInputStyled, {
-    id: textId,
-    type: "text",
-    disabled: disabled,
-    placeholder: placeholder,
-    value: fileName,
-    readOnly: true,
-    color: errorText ? Color.DANGER : Color.FORM
-  }), React.createElement(InputFileButtonStyled, null, React.createElement(Button, {
-    id: buttonId,
-    type: "button",
-    color: "secondary",
-    size: "field",
-    view: "shape",
-    isDisabled: disabled,
-    onClick: () => {
-      var _fieldRef$current;
-      return fieldRef === null || fieldRef === void 0 || (_fieldRef$current = fieldRef.current) === null || _fieldRef$current === void 0 ? void 0 : _fieldRef$current.click();
-    },
-    icon: React.createElement(AttachmentIcon, {
-      size: "medium",
-      view: "lined"
-    })
-  }, buttonText))), !!errorText && React.createElement(InputFileErrorStyled, null, errorText));
+    error: errorText,
+    children: [_jsxs(InputFileFieldsStyled, {
+      children: [_jsx(InputFileInputHiddenStyled, {
+        ref: fieldRef,
+        id: fileId,
+        type: "file",
+        disabled: disabled,
+        accept: accept,
+        onChange: uploadFile,
+        value: ""
+      }), _jsx(InputFileInputStyled, {
+        id: textId,
+        type: "text",
+        disabled: disabled,
+        placeholder: placeholder,
+        value: fileName,
+        readOnly: true,
+        color: errorText ? Color.DANGER : Color.FORM
+      }), _jsx(InputFileButtonStyled, {
+        children: _jsx(Button, {
+          id: buttonId,
+          type: "button",
+          color: "secondary",
+          size: "field",
+          view: "shape",
+          isDisabled: disabled,
+          onClick: () => {
+            var _fieldRef$current;
+            return fieldRef === null || fieldRef === void 0 || (_fieldRef$current = fieldRef.current) === null || _fieldRef$current === void 0 ? void 0 : _fieldRef$current.click();
+          },
+          icon: _jsx(AttachmentIcon, {
+            size: "medium",
+            view: "lined"
+          }),
+          children: buttonText
+        })
+      })]
+    }), !!errorText && _jsx(InputFileErrorStyled, {
+      children: errorText
+    })]
+  });
 }

package/Link/Link.js

@@ -1,11 +1,11 @@
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { LinkBox } from './styles';
 export function Link(props) {
   const {
     boxRef,
     ...rest
   } = props;
-  return React.createElement(LinkBox, {
+  return _jsx(LinkBox, {
     ...rest,
     ref: boxRef
   });

package/Modal/components/Modal/Modal.js

@@ -1,4 +1,5 @@
-import React, { useState, useCallback, useEffect, useRef } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback, useEffect, useRef } from 'react';
 import { createPortal } from 'react-dom';
 import { modalSizes } from './maps';
 import { LockBody, ModalBox, ModalBoxTrans, ModalContainer, ModalInner } from './styles';
@@ -33,16 +34,20 @@ export function Modal(props) {
     (_document$body$lastCh = document.body.lastChild) === null || _document$body$lastCh === void 0 || _document$body$lastCh.after(element);
     return () => element.remove();
   }, [element]);
-  return createPortal(React.createElement(ModalBoxTrans, {
+  return createPortal(_jsx(ModalBoxTrans, {
     nodeRef: ref,
-    isOpen: isOpen
-  }, React.createElement(ModalBox, {
-    ref: ref,
-    "$zIndex": resolvedZIndex
-  }, React.createElement(LockBody, null), React.createElement(ModalInner, {
-    onMouseDown: handleClose
-  }, React.createElement(ModalContainer, {
-    "$width": modalSizes[size],
-    onClick: handleClose
-  }, typeof children === 'function' ? children() : children)))), element);
+    isOpen: isOpen,
+    children: _jsxs(ModalBox, {
+      ref: ref,
+      "$zIndex": resolvedZIndex,
+      children: [_jsx(LockBody, {}), _jsx(ModalInner, {
+        onMouseDown: handleClose,
+        children: _jsx(ModalContainer, {
+          "$width": modalSizes[size],
+          onClick: handleClose,
+          children: typeof children === 'function' ? children() : children
+        })
+      })]
+    })
+  }), element);
 }

package/Modal/components/Modal/styles.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { CSSTransition } from 'react-transition-group';
 import styled, { createGlobalStyle } from 'styled-components';
 import { ShapeRadius } from '@pushwoosh/kit-constants';
@@ -21,14 +21,15 @@ function ModalBoxBase(props) {
     className,
     children
   } = props;
-  return React.createElement(CSSTransition, {
+  return _jsx(CSSTransition, {
     appear: true,
     in: isOpen,
     timeout: animationTimeout,
     classNames: className,
     unmountOnExit: true,
-    nodeRef: nodeRef
-  }, children);
+    nodeRef: nodeRef,
+    children: children
+  });
 }
 export const ModalBoxTrans = styled(ModalBoxBase).withConfig({
   displayName: "ModalBoxTrans",

package/Modal/components/ModalConfirm/ModalConfirm.js

@@ -1,23 +1,35 @@
-import React, { useState, useCallback } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback } from 'react';
 import { Vertical, Horizontal } from '@pushwoosh/kit-helpers';
 import { Banner } from '../../../Banner';
 import { Button } from '../../../Button';
+import { useLang } from '../../polyglot';
 import { Modal } from '../Modal';
 import { ModalHeader, ModalBody, ModalFooter } from '../ModalContent';
 import { ModalTitle } from '../ModalTitle';
 export function ModalConfirm(props) {
+  const lang = useLang();
   const {
     isOpen,
-    title = 'Confirm action',
+    title,
     size = 'small',
     description = '',
-    confirmButtonText = 'Confirm',
-    cancelButtonText = 'Cancel',
+    confirmButtonText,
+    cancelButtonText,
     confirmButtonColor = 'primary',
     callback,
     onAccept,
     onCancel
   } = props;
+  const resolvedTitle = title ?? lang({
+    message: 'DUMB.MODAL.CONFIRM_TITLE'
+  });
+  const resolvedConfirmText = confirmButtonText ?? lang({
+    message: 'DUMB.MODAL.CONFIRM'
+  });
+  const resolvedCancelText = cancelButtonText ?? lang({
+    message: 'DUMB.MODAL.CANCEL'
+  });
   const [isLoading, setIsLoading] = useState(false);
   const [errorMessage, setErrorMessage] = useState('');
   const handleConfirm = useCallback(async () => {
@@ -27,29 +39,44 @@ export function ModalConfirm(props) {
       await (callback === null || callback === void 0 ? void 0 : callback());
       await onAccept();
     } catch (error) {
-      setErrorMessage((error === null || error === void 0 ? void 0 : error.message) || 'Unexpected error occurred');
+      setErrorMessage((error === null || error === void 0 ? void 0 : error.message) || lang({
+        message: 'DUMB.MODAL.UNEXPECTED_ERROR'
+      }));
     } finally {
       setIsLoading(false);
     }
-  }, [callback, onAccept]);
-  return React.createElement(Modal, {
+  }, [callback, onAccept, lang]);
+  return _jsxs(Modal, {
     size: size,
     isOpen: isOpen,
-    onClose: onCancel
-  }, React.createElement(ModalHeader, null, React.createElement(Vertical, {
-    "$gap": 8
-  }, React.createElement(ModalTitle, null, title), errorMessage && React.createElement(Banner, {
-    type: "error",
-    title: errorMessage
-  }))), description && React.createElement(ModalBody, null, description), React.createElement(ModalFooter, null, React.createElement(Horizontal, {
-    "$justifyContent": "end",
-    "$gap": 8
-  }, React.createElement(Button, {
-    color: "secondary",
-    onClick: onCancel
-  }, cancelButtonText), React.createElement(Button, {
-    color: confirmButtonColor,
-    isLoading: isLoading,
-    onClick: handleConfirm
-  }, confirmButtonText))));
+    onClose: onCancel,
+    children: [_jsx(ModalHeader, {
+      children: _jsxs(Vertical, {
+        "$gap": 8,
+        children: [_jsx(ModalTitle, {
+          children: resolvedTitle
+        }), errorMessage && _jsx(Banner, {
+          type: "error",
+          title: errorMessage
+        })]
+      })
+    }), description && _jsx(ModalBody, {
+      children: description
+    }), _jsx(ModalFooter, {
+      children: _jsxs(Horizontal, {
+        "$justifyContent": "end",
+        "$gap": 8,
+        children: [_jsx(Button, {
+          color: "secondary",
+          onClick: onCancel,
+          children: resolvedCancelText
+        }), _jsx(Button, {
+          color: confirmButtonColor,
+          isLoading: isLoading,
+          onClick: handleConfirm,
+          children: resolvedConfirmText
+        })]
+      })
+    })]
+  });
 }

package/Modal/components/ModalConfirm/ModalConfirmProvider.d.ts

@@ -1,4 +1,4 @@
-import React, { type ReactElement, type PropsWithChildren } from 'react';
+import { type ReactElement, type PropsWithChildren } from 'react';
 import type { ModalConfirmContextProps } from './types';
-export declare const ModalConfirmContext: React.Context<ModalConfirmContextProps | null>;
+export declare const ModalConfirmContext: import("react").Context<ModalConfirmContextProps | null>;
 export declare function ModalConfirmProvider(props: PropsWithChildren): ReactElement;

package/Modal/components/ModalConfirm/ModalConfirmProvider.js

@@ -1,4 +1,5 @@
-import React, { useState, useMemo, createContext } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useMemo, createContext } from 'react';
 import { ModalConfirm } from './ModalConfirm';
 export const ModalConfirmContext = createContext(null);
 export function ModalConfirmProvider(props) {
@@ -27,9 +28,10 @@ export function ModalConfirmProvider(props) {
       closeModalConfirm
     };
   }, []);
-  return React.createElement(ModalConfirmContext.Provider, {
-    value: contextValue
-  }, children, React.createElement(ModalConfirm, {
-    ...modalConfirmParams
-  }));
+  return _jsxs(ModalConfirmContext.Provider, {
+    value: contextValue,
+    children: [children, _jsx(ModalConfirm, {
+      ...modalConfirmParams
+    })]
+  });
 }

package/Modal/components/ModalConfirm/types.d.ts

@@ -3,7 +3,7 @@ import { type modalSizes } from '../Modal/maps';
 export type ConfirmButtonColor = 'primary' | 'secondary' | 'danger';
 export interface ModalConfirmProps {
     isOpen: boolean;
-    title: string;
+    title?: string;
     size?: keyof typeof modalSizes;
     description?: ReactNode;
     confirmButtonText?: string;

package/Modal/components/ModalTitle/ModalTitle.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { CloseIcon } from '@pushwoosh/kit-icons';
 import { ModalTitleBox } from './styles';
 import { GhostButton } from '../../../Button';
@@ -8,11 +8,13 @@ export function ModalTitle(props) {
     onClose,
     ...rest
   } = props;
-  return React.createElement(ModalTitleBox, {
-    ...rest
-  }, children, onClose && React.createElement(GhostButton, {
-    onClick: onClose
-  }, React.createElement(CloseIcon, {
-    size: "medium"
-  })));
+  return _jsxs(ModalTitleBox, {
+    ...rest,
+    children: [children, onClose && _jsx(GhostButton, {
+      onClick: onClose,
+      children: _jsx(CloseIcon, {
+        size: "medium"
+      })
+    })]
+  });
 }

package/Modal/polyglot/index.d.ts

@@ -0,0 +1,2 @@
+import { type ModalMessages } from './types';
+export declare const useLang: () => (props: import("../../polyglot").LangProps<ModalMessages>) => string;

package/Modal/polyglot/index.js

@@ -0,0 +1,9 @@
+import { messages as en } from './messages_en';
+import { messages as ru } from './messages_ru';
+import { createLang } from '../../polyglot';
+export const {
+  useLang
+} = createLang({
+  en,
+  ru
+});

package/Modal/polyglot/messages_en.d.ts

@@ -0,0 +1,3 @@
+import { type ModalMessages } from './types';
+import type { LangMessages } from '../../polyglot';
+export declare const messages: LangMessages<ModalMessages>;

package/Modal/polyglot/messages_en.js

@@ -0,0 +1,6 @@
+export const messages = {
+  'DUMB.MODAL.UNEXPECTED_ERROR': 'Unexpected error occurred',
+  'DUMB.MODAL.CONFIRM_TITLE': 'Confirm action',
+  'DUMB.MODAL.CONFIRM': 'Confirm',
+  'DUMB.MODAL.CANCEL': 'Cancel'
+};

package/Modal/polyglot/messages_ru.d.ts

@@ -0,0 +1,3 @@
+import { type ModalMessages } from './types';
+import type { LangMessages } from '../../polyglot';
+export declare const messages: LangMessages<ModalMessages>;

package/Modal/polyglot/messages_ru.js

@@ -0,0 +1,6 @@
+export const messages = {
+  'DUMB.MODAL.UNEXPECTED_ERROR': 'Произошла непредвиденная ошибка',
+  'DUMB.MODAL.CONFIRM_TITLE': 'Подтвердите действие',
+  'DUMB.MODAL.CONFIRM': 'Подтвердить',
+  'DUMB.MODAL.CANCEL': 'Отмена'
+};

package/Modal/polyglot/types.d.ts

@@ -0,0 +1,7 @@
+import type { NoParams } from '../../polyglot';
+export type ModalMessages = {
+    'DUMB.MODAL.UNEXPECTED_ERROR': NoParams;
+    'DUMB.MODAL.CONFIRM_TITLE': NoParams;
+    'DUMB.MODAL.CONFIRM': NoParams;
+    'DUMB.MODAL.CANCEL': NoParams;
+};

package/Modal/polyglot/types.js

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

package/NotificationInbox/NotificationBar.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Color } from '@pushwoosh/kit-constants';
 import { NotificationIcon } from '@pushwoosh/kit-icons';
 import { NotificationBarButton, NotificationBarIcon, NotificationBarBadge, NotificationBarText, NotificationBarBadgeText } from './styles';
@@ -28,18 +28,26 @@ export function NotificationBar({
     if (type === 'no-notifications') return Color.MAIN;
     return Color.CLEAR;
   };
-  return React.createElement(NotificationBarButton, {
+  return _jsxs(NotificationBarButton, {
     "$type": type,
     "$isOpened": isOpened,
     "$read": read,
     onClick: onClick,
-    type: "button"
-  }, React.createElement(NotificationBarIcon, null, React.createElement(NotificationIcon, {
-    type: "enabled",
-    size: "small",
-    view: getIconView(isOpened, shouldUseFilledIcon, hasNotifications),
-    color: getIconColor()
-  })), React.createElement(NotificationBarText, null, "Notification center"), hasNotifications && React.createElement(NotificationBarBadge, null, React.createElement(NotificationBarBadgeText, {
-    "$variant": "h5"
-  }, count)));
+    type: "button",
+    children: [_jsx(NotificationBarIcon, {
+      children: _jsx(NotificationIcon, {
+        type: "enabled",
+        size: "small",
+        view: getIconView(isOpened, shouldUseFilledIcon, hasNotifications),
+        color: getIconColor()
+      })
+    }), _jsx(NotificationBarText, {
+      children: "Notification center"
+    }), hasNotifications && _jsx(NotificationBarBadge, {
+      children: _jsx(NotificationBarBadgeText, {
+        "$variant": "h5",
+        children: count
+      })
+    })]
+  });
 }