@pushwoosh/dumb-components 1.1.135 → 1.1.136

package/DateTimePicker/components/YearView/YearView.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { Columns } from '@pushwoosh/kit-helpers';
 import { format, addPeriod, setPeriod, monthName, isSamePeriod } from '../../helpers';
 import { CellBox, DateInfo } from '../../styles';
@@ -10,23 +10,27 @@ export function YearView(props) {
     onChange,
     onSelect
   } = props;
-  return React.createElement(PickerPlate, {
+  return _jsx(PickerPlate, {
     onPrev: () => onChange(format(addPeriod(year, 'year', -1), 'year')),
     onNext: () => onChange(format(addPeriod(year, 'year', 1), 'year')),
-    slot: React.createElement(DateInfo, null, year)
-  }, React.createElement(Columns, {
-    "$sizes": 4,
-    "$gap": 4,
-    "$justifyContent": "space-between"
-  }, Array.from({
-    length: 12
-  }).map((_, i) => {
-    const month = format(setPeriod(year, 'month', i + 1), 'year-month');
-    return React.createElement(CellBox, {
-      key: `${year}-${month}`,
-      height: "59px",
-      "$isActive": !!activeDay && isSamePeriod(month, activeDay, 'month'),
-      onClick: () => onSelect(month)
-    }, monthName(i + 1, 'short'));
-  })));
+    slot: _jsx(DateInfo, {
+      children: year
+    }),
+    children: _jsx(Columns, {
+      "$sizes": 4,
+      "$gap": 4,
+      "$justifyContent": "space-between",
+      children: Array.from({
+        length: 12
+      }).map((_, i) => {
+        const month = format(setPeriod(year, 'month', i + 1), 'year-month');
+        return _jsx(CellBox, {
+          height: "59px",
+          "$isActive": !!activeDay && isSamePeriod(month, activeDay, 'month'),
+          onClick: () => onSelect(month),
+          children: monthName(i + 1, 'short')
+        }, `${year}-${month}`);
+      })
+    })
+  });
 }

package/Drawer/components/Drawer/Drawer.js

@@ -1,4 +1,5 @@
-import React, { useRef, useState, useEffect, useCallback } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef, useState, useEffect, useCallback } from 'react';
 import { createPortal } from 'react-dom';
 import { drawerSizes } from './maps';
 import { DrawerBoxTrans, DrawerBox, LockBody, DrawerInner, DrawerContainer } from './styles';
@@ -40,18 +41,22 @@ export function Drawer({
       handleClose(event);
     }
   }, [handleClose, closeOnClickOutside]);
-  return createPortal(React.createElement(DrawerBoxTrans, {
+  return createPortal(_jsx(DrawerBoxTrans, {
     nodeRef: ref,
     isOpen: isOpen,
-    withoutLockScreen: withoutLockScreen
-  }, React.createElement(DrawerBox, {
-    ref: ref,
-    "$zIndex": resolvedZIndex
-  }, React.createElement(LockBody, null), React.createElement(DrawerInner, {
-    onMouseDown: handleClickOutside,
-    "$padding": padding
-  }, React.createElement(DrawerContainer, {
-    "$width": drawerSizes[size],
-    onClick: handleClose
-  }, children)))), element);
+    withoutLockScreen: withoutLockScreen,
+    children: _jsxs(DrawerBox, {
+      ref: ref,
+      "$zIndex": resolvedZIndex,
+      children: [_jsx(LockBody, {}), _jsx(DrawerInner, {
+        onMouseDown: handleClickOutside,
+        "$padding": padding,
+        children: _jsx(DrawerContainer, {
+          "$width": drawerSizes[size],
+          onClick: handleClose,
+          children: children
+        })
+      })]
+    })
+  }), element);
 }

package/Drawer/components/Drawer/styles.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { type FC } from 'react';
 import type { ContentPadding, DrawerBoxBaseProps, IDrawerBoxTransProps } from './types';
 export declare const LockBody: import("styled-components").GlobalStyleComponent<{}, import("styled-components").DefaultTheme>;
 export declare const DrawerBox: import("styled-components").StyledComponent<"div", any, {
@@ -7,7 +7,7 @@ export declare const DrawerBox: import("styled-components").StyledComponent<"div
 export declare const DrawerInner: import("styled-components").StyledComponent<"div", any, {
     $padding?: ContentPadding;
 }, never>;
-export declare const DrawerBoxTrans: import("styled-components").StyledComponent<React.FC<DrawerBoxBaseProps>, any, IDrawerBoxTransProps, never>;
+export declare const DrawerBoxTrans: import("styled-components").StyledComponent<FC<DrawerBoxBaseProps>, any, IDrawerBoxTransProps, never>;
 export declare const DrawerContainer: import("styled-components").StyledComponent<"div", any, {
     $width: string;
 }, never>;

package/Drawer/components/Drawer/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';
@@ -40,14 +40,15 @@ const DrawerBoxBase = props => {
     className,
     children
   } = props;
-  return React.createElement(CSSTransition, {
+  return _jsx(CSSTransition, {
     appear: true,
     unmountOnExit: true,
     in: isOpen,
     timeout: animationTimeout,
     classNames: className,
-    nodeRef: nodeRef
-  }, children);
+    nodeRef: nodeRef,
+    children: children
+  });
 };
 export const DrawerBoxTrans = styled(DrawerBoxBase).withConfig({
   displayName: "DrawerBoxTrans",

package/Drawer/components/DrawerDocs/DrawerDocs.js

@@ -1,4 +1,5 @@
-import React, { useEffect, useRef, useState } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
 import { DrawerBodyIframe, IframeElement, LoadingBox } from './styles';
 import { Spinner } from '../../../Spinner';
 import { Lang, useLang } from '../../polyglot';
@@ -27,25 +28,29 @@ export function DrawerDocs(props) {
       window.removeEventListener('resize', updateDrawerWidth);
     };
   }, [isOpen]);
-  return React.createElement(Drawer, {
+  return _jsx(Drawer, {
     size: "large",
     isOpen: isOpen,
-    onClose: onClose
-  }, React.createElement(DrawerBodyIframe, {
-    ref: drawerDocsRef
-  }, !iframeLoaded && React.createElement(LoadingBox, null, React.createElement(Spinner, {
-    size: "medium"
-  }), ' ', React.createElement(Lang, {
-    message: "DUMB.DRAWER.DOCS_LOADING"
-  })), React.createElement(IframeElement, {
-    src: url,
-    ref: iframeRef,
-    title: lang({
-      message: 'DUMB.DRAWER.DOCS_TITLE'
-    }),
-    width: drawerWidth,
-    height: "95%",
-    "$isLoaded": iframeLoaded,
-    onLoad: () => setIframeLoaded(true)
-  })));
+    onClose: onClose,
+    children: _jsxs(DrawerBodyIframe, {
+      ref: drawerDocsRef,
+      children: [!iframeLoaded && _jsxs(LoadingBox, {
+        children: [_jsx(Spinner, {
+          size: "medium"
+        }), ' ', _jsx(Lang, {
+          message: "DUMB.DRAWER.DOCS_LOADING"
+        })]
+      }), _jsx(IframeElement, {
+        src: url,
+        ref: iframeRef,
+        title: lang({
+          message: 'DUMB.DRAWER.DOCS_TITLE'
+        }),
+        width: drawerWidth,
+        height: "95%",
+        "$isLoaded": iframeLoaded,
+        onLoad: () => setIframeLoaded(true)
+      })]
+    })
+  });
 }

package/DropdownMenu/components/DropdownMenu/DropdownMenu.js

@@ -1,5 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { autoPlacement, size, offset, useFloating } from '@floating-ui/react-dom';
-import React, { useState, useEffect, useCallback } from 'react';
+import { useState, useEffect, useCallback } from 'react';
 import { createPortal, flushSync } from 'react-dom';
 import { Place } from './styles';
 import { useLayer } from '../../../hooks';
@@ -75,27 +76,30 @@ export const DropdownMenu = ({
       }
     }
   }, [isOpen, isScrollable, refs.floating]);
-  return React.createElement(DropdownContext.Provider, {
-    value: setIsOpen
-  }, renderHandler({
-    onClick: () => {
-      if (isOpen) {
-        handleClose();
-      } else {
-        setIsOpen(true);
-      }
-    },
-    ref: refs.setReference,
-    isOpen
-  }), isOpen && createPortal(React.createElement(DropdownZIndexContext.Provider, {
-    value: resolvedZIndex
-  }, React.createElement(Place, {
-    ref: refs.setFloating,
-    style: floatingStyles,
-    "$color": color,
-    "$width": width ?? undefined,
-    "$fitContent": windowWidth === null && !fullWidth,
-    "$scrollable": isScrollable,
-    "$zIndex": resolvedZIndex
-  }, renderChildren(children))), document.body));
+  return _jsxs(DropdownContext.Provider, {
+    value: setIsOpen,
+    children: [renderHandler({
+      onClick: () => {
+        if (isOpen) {
+          handleClose();
+        } else {
+          setIsOpen(true);
+        }
+      },
+      ref: refs.setReference,
+      isOpen
+    }), isOpen && createPortal(_jsx(DropdownZIndexContext.Provider, {
+      value: resolvedZIndex,
+      children: _jsx(Place, {
+        ref: refs.setFloating,
+        style: floatingStyles,
+        "$color": color,
+        "$width": width ?? undefined,
+        "$fitContent": windowWidth === null && !fullWidth,
+        "$scrollable": isScrollable,
+        "$zIndex": resolvedZIndex,
+        children: renderChildren(children)
+      })
+    }), document.body)]
+  });
 };

package/DropdownMenu/components/DropdownMenuButton/DropdownMenuButton.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { Button } from '../../../Button';
 import { DropdownMenu } from '../DropdownMenu';
 export const DropdownMenuButton = ({
@@ -13,7 +13,7 @@ export const DropdownMenuButton = ({
   children,
   ...buttonProps
 }) => {
-  return React.createElement(DropdownMenu, {
+  return _jsx(DropdownMenu, {
     isScrollable: isScrollable,
     openOnMount: openOnMount,
     menuZIndex: menuZIndex,
@@ -23,13 +23,15 @@ export const DropdownMenuButton = ({
       ref,
       onClick,
       isOpen
-    }) => React.createElement(Button, {
+    }) => _jsx(Button, {
       ...buttonProps,
       boxRef: ref,
       onClick: onClick,
       isOpen: isOpen,
       isDisabled: isDisabled,
-      isLoading: isLoading
-    }, label)
-  }, children);
+      isLoading: isLoading,
+      children: label
+    }),
+    children: children
+  });
 };

package/DropdownMenu/components/DropdownMenuItem/DropdownMenuItem.js

@@ -1,4 +1,5 @@
-import React, { useContext } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useContext } from 'react';
 import { DropdownMenuItemStyled } from './styles';
 import { DropdownContext } from '../../context';
 export const DropdownMenuItem = ({
@@ -15,7 +16,7 @@ export const DropdownMenuItem = ({
       console.error('DropdownMenuItem must be inside DropdownMenu');
     }
   }
-  return React.createElement(DropdownMenuItemStyled, {
+  return _jsx(DropdownMenuItemStyled, {
     "$active": isActive,
     "$danger": isDanger,
     onClick: () => {
@@ -25,6 +26,7 @@ export const DropdownMenuItem = ({
       onClick();
     },
     disabled: disabled,
-    "data-active": isActive || undefined
-  }, children);
+    "data-active": isActive || undefined,
+    children: children
+  });
 };

package/DropdownMenu/components/DropdownMenuSection/DropdownMenuSection.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 { Horizontal } from '@pushwoosh/kit-helpers';
 import { Text } from '@pushwoosh/kit-typography';
@@ -8,13 +8,16 @@ export const DropdownMenuSection = ({
   bgColor,
   children
 }) => {
-  return React.createElement(DropdownMenuSectionRoot, {
-    "$bgColor": bgColor
-  }, title && React.createElement(Horizontal, {
-    "$padding": "8px 12px"
-  }, React.createElement(Text, {
-    "$variant": "h5",
-    "$color": Color.LOCKED,
-    "$uppercase": true
-  }, title)), children);
+  return _jsxs(DropdownMenuSectionRoot, {
+    "$bgColor": bgColor,
+    children: [title && _jsx(Horizontal, {
+      "$padding": "8px 12px",
+      children: _jsx(Text, {
+        "$variant": "h5",
+        "$color": Color.LOCKED,
+        "$uppercase": true,
+        children: title
+      })
+    }), children]
+  });
 };

package/DropdownMenu/components/DropdownMenuSubmenu/DropdownMenuSubmenu.js

@@ -1,5 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { flip, shift, useFloating } from '@floating-ui/react-dom';
-import React, { useCallback, useContext, useEffect, useRef, useState } from 'react';
+import { useCallback, useContext, useEffect, useRef, useState } from 'react';
 import { createPortal } from 'react-dom';
 import { ChevronIcon } from '@pushwoosh/kit-icons';
 import { SubmenuTriggerInner } from './styles';
@@ -58,34 +59,42 @@ export const DropdownMenuSubmenu = ({
     setIsOpen(false);
     parentClose === null || parentClose === void 0 || parentClose(false);
   }, [parentClose]);
-  return React.createElement(DropdownContext.Provider, {
-    value: closeChain
-  }, React.createElement(DropdownZIndexContext.Provider, {
-    value: submenuZIndex
-  }, React.createElement(DropdownMenuItemStyled, {
-    ref: refs.setReference,
-    type: "button",
-    "$active": isOpen,
-    "$danger": isDanger,
-    disabled: disabled,
-    onMouseEnter: scheduleOpen,
-    onMouseLeave: scheduleClose,
-    onClick: () => {
-      if (disabled) return;
-      clearTimers();
-      openedByClick.current = !isOpen;
-      setIsOpen(prev => !prev);
-    }
-  }, React.createElement(SubmenuTriggerInner, null, React.createElement("span", null, label), React.createElement(ChevronIcon, {
-    direction: "right",
-    size: "small"
-  }))), isOpen && createPortal(React.createElement(Place, {
-    ref: refs.setFloating,
-    style: floatingStyles,
-    "$fitContent": true,
-    "$zIndex": submenuZIndex,
-    onMouseEnter: clearTimers,
-    onMouseLeave: scheduleClose,
-    onClick: e => e.stopPropagation()
-  }, renderChildren(children)), document.body)));
+  return _jsx(DropdownContext.Provider, {
+    value: closeChain,
+    children: _jsxs(DropdownZIndexContext.Provider, {
+      value: submenuZIndex,
+      children: [_jsx(DropdownMenuItemStyled, {
+        ref: refs.setReference,
+        type: "button",
+        "$active": isOpen,
+        "$danger": isDanger,
+        disabled: disabled,
+        onMouseEnter: scheduleOpen,
+        onMouseLeave: scheduleClose,
+        onClick: () => {
+          if (disabled) return;
+          clearTimers();
+          openedByClick.current = !isOpen;
+          setIsOpen(prev => !prev);
+        },
+        children: _jsxs(SubmenuTriggerInner, {
+          children: [_jsx("span", {
+            children: label
+          }), _jsx(ChevronIcon, {
+            direction: "right",
+            size: "small"
+          })]
+        })
+      }), isOpen && createPortal(_jsx(Place, {
+        ref: refs.setFloating,
+        style: floatingStyles,
+        "$fitContent": true,
+        "$zIndex": submenuZIndex,
+        onMouseEnter: clearTimers,
+        onMouseLeave: scheduleClose,
+        onClick: e => e.stopPropagation(),
+        children: renderChildren(children)
+      }), document.body)]
+    })
+  });
 };

package/EditableField/EditableField.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 { Vertical } from '@pushwoosh/kit-helpers';
 import { DropdownIcon, EditIcon } from '@pushwoosh/kit-icons';
@@ -23,46 +24,57 @@ export function EditableField({
   const rootRef = useRef(null);
   const buttonRef = useRef(null);
   useOnClickOutside(rootRef, onCancel);
-  return React.createElement(PopoverContainer, {
-    ref: rootRef
-  }, React.createElement(FieldBox, {
-    open: open,
-    onClick: onToggleOpen,
-    ref: buttonRef
-  }, React.createElement("span", null, value), open ? React.createElement(DropdownIcon, {
-    direction: "up",
-    size: "small",
-    color: Color.CLEAR
-  }) : React.createElement(EditIcon, {
-    view: "lined",
-    size: "small"
-  })), React.createElement(Popover, {
-    open: open,
-    position: position,
-    anchorEl: buttonRef,
-    windowWidth: width,
-    internalWindowRef: rootRef,
-    loading: loading,
-    zIndex: zIndex
-  }, React.createElement(Vertical, {
-    "$padding": 16
-  }, title && React.createElement(TitleBox, null, title), children, React.createElement(ButtonsGroup, {
-    "$isLoading": loading
-  }, React.createElement(Button, {
-    view: "shape",
-    color: "primary",
-    size: "compact",
-    isLoading: loading,
-    onClick: onSubmit
-  }, React.createElement(Lang, {
-    message: "DUMB.EDITABLE_FIELD.SUBMIT"
-  })), React.createElement(Button, {
-    view: "shape",
-    color: "secondary",
-    size: "compact",
-    isDisabled: loading,
-    onClick: onCancel
-  }, React.createElement(Lang, {
-    message: "DUMB.EDITABLE_FIELD.CANCEL"
-  }))))));
+  return _jsxs(PopoverContainer, {
+    ref: rootRef,
+    children: [_jsxs(FieldBox, {
+      open: open,
+      onClick: onToggleOpen,
+      ref: buttonRef,
+      children: [_jsx("span", {
+        children: value
+      }), open ? _jsx(DropdownIcon, {
+        direction: "up",
+        size: "small",
+        color: Color.CLEAR
+      }) : _jsx(EditIcon, {
+        view: "lined",
+        size: "small"
+      })]
+    }), _jsx(Popover, {
+      open: open,
+      position: position,
+      anchorEl: buttonRef,
+      windowWidth: width,
+      internalWindowRef: rootRef,
+      loading: loading,
+      zIndex: zIndex,
+      children: _jsxs(Vertical, {
+        "$padding": 16,
+        children: [title && _jsx(TitleBox, {
+          children: title
+        }), children, _jsxs(ButtonsGroup, {
+          "$isLoading": loading,
+          children: [_jsx(Button, {
+            view: "shape",
+            color: "primary",
+            size: "compact",
+            isLoading: loading,
+            onClick: onSubmit,
+            children: _jsx(Lang, {
+              message: "DUMB.EDITABLE_FIELD.SUBMIT"
+            })
+          }), _jsx(Button, {
+            view: "shape",
+            color: "secondary",
+            size: "compact",
+            isDisabled: loading,
+            onClick: onCancel,
+            children: _jsx(Lang, {
+              message: "DUMB.EDITABLE_FIELD.CANCEL"
+            })
+          })]
+        })]
+      })
+    })]
+  });
 }

package/EmailTemplatePreview/EmailTemplatePreview.js

@@ -1,5 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { Liquid } from 'liquidjs';
-import React, { useMemo, useState } from 'react';
+import { useMemo, useState } from 'react';
 import { replaceLocalization, replacePlaceholders } from './helpers';
 import { IframeStyled } from './styles';
 const createLiquidInstance = () => {
@@ -37,13 +38,14 @@ export function EmailTemplatePreview(props) {
       return `<body style="font-size: 24px; color: darkred">${e.message}</body>`;
     }
   }, [template, localization, values, liquidInstance]);
-  return React.createElement(IframeStyled, {
+  return _jsx(IframeStyled, {
     "$scale": scale,
     "$width": width,
-    "$height": height
-  }, React.createElement("iframe", {
-    srcDoc: src,
-    sandbox: "allow-same-origin",
-    title: "preview"
-  }));
+    "$height": height,
+    children: _jsx("iframe", {
+      srcDoc: src,
+      sandbox: "allow-same-origin",
+      title: "preview"
+    })
+  });
 }

package/EmailTemplatePreview/components/NoEmailTemplatePreview/NoEmailTemplatePreview.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 { Text } from '@pushwoosh/kit-typography';
@@ -7,26 +7,32 @@ import { Container, PreviewMock } from './styles';
 import { Lang, useLang } from '../../polyglot';
 export function NoEmailTemplatePreview() {
   const lang = useLang();
-  return React.createElement(Container, {
+  return _jsxs(Container, {
     "$padding": "12px 12px 24px",
-    "$gap": 12
-  }, React.createElement(PreviewMock, {
-    "$alignItems": "center",
-    "$justifyContent": "center"
-  }, React.createElement("img", {
-    src: Email,
-    alt: lang({
-      message: 'DUMB.EMAIL_TEMPLATE_PREVIEW.ALT'
-    })
-  })), React.createElement(Vertical, null, React.createElement(Text, {
-    "$variant": "footnote",
-    "$color": Color.LOCKED
-  }, React.createElement(Lang, {
-    message: "DUMB.EMAIL_TEMPLATE_PREVIEW.CONTENT_MISSED"
-  })), React.createElement(Text, {
-    "$variant": "footnote",
-    "$color": Color.LOCKED
-  }, React.createElement(Lang, {
-    message: "DUMB.EMAIL_TEMPLATE_PREVIEW.HINT"
-  }))));
+    "$gap": 12,
+    children: [_jsx(PreviewMock, {
+      "$alignItems": "center",
+      "$justifyContent": "center",
+      children: _jsx("img", {
+        src: Email,
+        alt: lang({
+          message: 'DUMB.EMAIL_TEMPLATE_PREVIEW.ALT'
+        })
+      })
+    }), _jsxs(Vertical, {
+      children: [_jsx(Text, {
+        "$variant": "footnote",
+        "$color": Color.LOCKED,
+        children: _jsx(Lang, {
+          message: "DUMB.EMAIL_TEMPLATE_PREVIEW.CONTENT_MISSED"
+        })
+      }), _jsx(Text, {
+        "$variant": "footnote",
+        "$color": Color.LOCKED,
+        children: _jsx(Lang, {
+          message: "DUMB.EMAIL_TEMPLATE_PREVIEW.HINT"
+        })
+      })]
+    })]
+  });
 }

package/EnhancedInput/EnhancedInput.d.ts

@@ -1,6 +1,5 @@
-import React from 'react';
-export declare const EnhancedInput: React.ForwardRefExoticComponent<React.InputHTMLAttributes<HTMLInputElement> & import("../native/Input").NativeInputProps & {
-    $icon?: React.ReactNode;
+export declare const EnhancedInput: import("react").ForwardRefExoticComponent<import("react").InputHTMLAttributes<HTMLInputElement> & import("../native/Input").NativeInputProps & {
+    $icon?: import("react").ReactNode;
     $onClear?: () => void;
     hint?: string;
-} & React.RefAttributes<HTMLInputElement>>;
+} & import("react").RefAttributes<HTMLInputElement>>;