framework7-react 7.0.8 → 8.0.0-beta.1

package/components/list.d.ts

@@ -10,11 +10,32 @@ export interface ListProps {
   className?: string;
   style?: React.CSSProperties;
   inset ?: boolean;
+  insetIos ?: boolean;
+  insetMd ?: boolean;
   xsmallInset ?: boolean;
+  xsmallInsetIos ?: boolean;
+  xsmallInsetMd ?: boolean;
   smallInset ?: boolean;
+  smallInsetIos ?: boolean;
+  smallInsetMd ?: boolean;
   mediumInset ?: boolean;
+  mediumInsetIos ?: boolean;
+  mediumInsetMd ?: boolean;
   largeInset ?: boolean;
+  largeInsetIos ?: boolean;
+  largeInsetMd ?: boolean;
   xlargeInset ?: boolean;
+  xlargeInsetIos ?: boolean;
+  xlargeInsetMd ?: boolean;
+  strong?: boolean;
+  strongIos?: boolean;
+  strongMd?: boolean;
+  outline?: boolean;
+  outlineIos?: boolean;
+  outlineMd?: boolean;
+  dividers?: boolean;
+  dividersIos?: boolean;
+  dividersMd?: boolean;
   mediaList ?: boolean;
   sortable ?: boolean;
   sortableTapHold ?: boolean;
@@ -27,21 +48,12 @@ export interface ListProps {
   simpleList ?: boolean;
   linksList ?: boolean;
   menuList ?: boolean;
-  noHairlines ?: boolean;
-  noHairlinesBetween ?: boolean;
-  noHairlinesMd ?: boolean;
-  noHairlinesBetweenMd ?: boolean;
-  noHairlinesIos ?: boolean;
-  noHairlinesBetweenIos ?: boolean;
-  noHairlinesAurora ?: boolean;
-  noHairlinesBetweenAurora ?: boolean;
   noChevron ?: boolean;
   chevronCenter ?: boolean;
   tab ?: boolean;
   tabActive ?: boolean;
   form ?: boolean;
   formStoreData ?: boolean;
-  inlineLabels ?: boolean;
   virtualList ?: boolean;
   virtualListParams ?: Object;
   color?: string;

package/components/list.js

@@ -1,5 +1,4 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React, { forwardRef, useRef, useImperativeHandle } from 'react';
 import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
 import { classNames, getExtraAttrs, getSlots, flattenArray, emit, extend } from '../shared/utils.js';
@@ -16,11 +15,32 @@ const List = /*#__PURE__*/forwardRef((props, ref) => {
     id,
     style,
     inset,
+    insetIos,
+    insetMd,
     xsmallInset,
+    xsmallInsetIos,
+    xsmallInsetMd,
     smallInset,
+    smallInsetIos,
+    smallInsetMd,
     mediumInset,
+    mediumInsetIos,
+    mediumInsetMd,
     largeInset,
+    largeInsetIos,
+    largeInsetMd,
     xlargeInset,
+    xlargeInsetIos,
+    xlargeInsetMd,
+    strong,
+    strongIos,
+    strongMd,
+    outline,
+    outlineIos,
+    outlineMd,
+    dividers,
+    dividersIos,
+    dividersMd,
     mediaList,
     sortable,
     sortableTapHold,
@@ -33,57 +53,41 @@ const List = /*#__PURE__*/forwardRef((props, ref) => {
     simpleList,
     linksList,
     menuList,
-    noHairlines,
-    noHairlinesBetween,
-    noHairlinesMd,
-    noHairlinesBetweenMd,
-    noHairlinesIos,
-    noHairlinesBetweenIos,
-    noHairlinesAurora,
-    noHairlinesBetweenAurora,
     noChevron,
     chevronCenter,
     tab,
     tabActive,
     form,
     formStoreData,
-    inlineLabels,
     virtualList,
     virtualListParams
   } = props;
   const extraAttrs = getExtraAttrs(props);
   const elRef = useRef(null);
-
   const onSubmit = event => {
     emit(props, 'submit', event);
   };
-
   const onSortableEnable = el => {
     if (elRef.current !== el) return;
     emit(props, 'sortableEnable');
   };
-
   const onSortableDisable = el => {
     if (elRef.current !== el) return;
     emit(props, 'sortableDisable');
   };
-
   const onSortableSort = (el, sortData, listEl) => {
     if (elRef.current !== listEl) return;
     emit(props, 'sortableSort', sortData);
   };
-
   const onSortableMove = (el, listEl) => {
     if (elRef.current !== listEl) return;
     emit(props, 'sortableMove', el, listEl);
   };
-
   useImperativeHandle(ref, () => ({
     el: elRef.current,
     f7VirtualList: () => f7VirtualList.current
   }));
   useTab(elRef, props);
-
   const attachEvents = () => {
     f7ready(() => {
       f7.on('sortableEnable', onSortableEnable);
@@ -92,7 +96,6 @@ const List = /*#__PURE__*/forwardRef((props, ref) => {
       f7.on('sortableMove', onSortableMove);
     });
   };
-
   const detachEvents = () => {
     if (!f7) return;
     f7.off('sortableEnable', onSortableEnable);
@@ -100,7 +103,6 @@ const List = /*#__PURE__*/forwardRef((props, ref) => {
     f7.off('sortableSort', onSortableSort);
     f7.off('sortableMove', onSortableMove);
   };
-
   const onMount = () => {
     f7ready(() => {
       if (!virtualList) return;
@@ -113,34 +115,28 @@ const List = /*#__PURE__*/forwardRef((props, ref) => {
             const vl = this;
             emit(props, 'virtualItemBeforeInsert', vl, itemEl, item);
           },
-
           beforeClear(fragment) {
             const vl = this;
             emit(props, 'virtualBeforeClear', vl, fragment);
           },
-
           itemsBeforeInsert(fragment) {
             const vl = this;
             emit(props, 'virtualItemsBeforeInsert', vl, fragment);
           },
-
           itemsAfterInsert(fragment) {
             const vl = this;
             emit(props, 'virtualItemsAfterInsert', vl, fragment);
           }
-
         }
       }, vlParams));
     });
   };
-
   const onDestroy = () => {
     if (!f7) return;
     if (!(virtualList && f7VirtualList.current)) return;
     if (f7VirtualList.current.destroy) f7VirtualList.current.destroy();
     f7VirtualList.current = null;
   };
-
   useIsomorphicLayoutEffect(() => {
     onMount();
     return onDestroy;
@@ -162,11 +158,9 @@ const List = /*#__PURE__*/forwardRef((props, ref) => {
   flattenSlots.forEach(child => {
     if (typeof child === 'undefined') return;
     let tag = child.type && (child.type.displayName || child.type.name);
-
     if (!tag && typeof child.type === 'string') {
       tag = child.type;
     }
-
     if (!tag || tag && !(tag === 'li' || tag.indexOf('f7-list-item') >= 0 || tag.indexOf('f7-list-button') >= 0 || tag.indexOf('f7-list-input') >= 0)) {
       if (wasUlChild) rootChildrenAfterList.push(child);else rootChildrenBeforeList.push(child);
     } else if (tag) {
@@ -177,11 +171,32 @@ const List = /*#__PURE__*/forwardRef((props, ref) => {
   const ListTag = form ? 'form' : 'div';
   const classes = classNames(className, 'list', {
     inset,
+    'inset-ios': insetIos,
+    'inset-md': insetMd,
     'xsmall-inset': xsmallInset,
+    'xsmall-inset-ios': xsmallInsetIos,
+    'xsmall-inset-md': xsmallInsetMd,
     'small-inset': smallInset,
+    'small-inset-ios': smallInsetIos,
+    'small-inset-md': smallInsetMd,
     'medium-inset': mediumInset,
+    'medium-inset-ios': mediumInsetIos,
+    'medium-inset-md': mediumInsetMd,
     'large-inset': largeInset,
+    'large-inset-ios': largeInsetIos,
+    'large-inset-md': largeInsetMd,
     'xlarge-inset': xlargeInset,
+    'xlarge-inset-ios': xlargeInsetIos,
+    'xlarge-inset-md': xlargeInsetMd,
+    'list-strong': strong,
+    'list-strong-ios': strongIos,
+    'list-strong-md': strongMd,
+    'list-outline': outline,
+    'list-outline-ios': outlineIos,
+    'list-outline-md': outlineMd,
+    'list-dividers': dividers,
+    'list-dividers-ios': dividersIos,
+    'list-dividers-md': dividersMd,
     'media-list': mediaList,
     'simple-list': simpleList,
     'links-list': linksList,
@@ -196,16 +211,7 @@ const List = /*#__PURE__*/forwardRef((props, ref) => {
     'virtual-list': virtualList,
     tab,
     'tab-active': tabActive,
-    'no-hairlines': noHairlines,
-    'no-hairlines-md': noHairlinesMd,
-    'no-hairlines-ios': noHairlinesIos,
-    'no-hairlines-aurora': noHairlinesAurora,
-    'no-hairlines-between': noHairlinesBetween,
-    'no-hairlines-between-md': noHairlinesBetweenMd,
-    'no-hairlines-between-ios': noHairlinesBetweenIos,
-    'no-hairlines-between-aurora': noHairlinesBetweenAurora,
     'form-store-data': formStoreData,
-    'inline-labels': inlineLabels,
     'no-chevron': noChevron,
     'chevron-center': chevronCenter
   }, colorClasses(props));

package/components/login-screen-title.js

@@ -1,9 +1,9 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React, { forwardRef, useRef, useImperativeHandle } from 'react';
 import { classNames, getExtraAttrs } from '../shared/utils.js';
 import { colorClasses } from '../shared/mixins.js';
 
+
 const LoginScreenTitle = /*#__PURE__*/forwardRef((props, ref) => {
   const {
     className,

package/components/login-screen.js

@@ -1,5 +1,4 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React, { forwardRef, useRef, useImperativeHandle } from 'react';
 import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
 import { classNames, getExtraAttrs, emit } from '../shared/utils.js';
@@ -24,43 +23,37 @@ const LoginScreen = /*#__PURE__*/forwardRef((props, ref) => {
   const isOpened = useRef(opened);
   const isClosing = useRef(false);
   const elRef = useRef(null);
-
   const onOpen = instance => {
     isOpened.current = true;
     isClosing.current = false;
     emit(props, 'loginScreenOpen', instance);
   };
-
   const onOpened = instance => {
     emit(props, 'loginScreenOpened', instance);
   };
-
   const onClose = instance => {
     isOpened.current = false;
     isClosing.current = true;
     emit(props, 'loginScreenClose', instance);
   };
-
   const onClosed = instance => {
     isClosing.current = false;
     emit(props, 'loginScreenClosed', instance);
   };
-
   useImperativeHandle(ref, () => ({
     el: elRef.current,
     f7LoginScreen: () => f7LoginScreen.current
-  })); // watch opened changes
+  }));
 
+  // watch opened changes
   watchProp(opened, value => {
     if (!f7LoginScreen.current) return;
-
     if (value) {
       f7LoginScreen.current.open();
     } else {
       f7LoginScreen.current.close();
     }
   });
-
   const modalEvents = method => {
     if (!f7LoginScreen.current) return;
     f7LoginScreen.current[method]('open', onOpen);
@@ -68,7 +61,6 @@ const LoginScreen = /*#__PURE__*/forwardRef((props, ref) => {
     f7LoginScreen.current[method]('close', onClose);
     f7LoginScreen.current[method]('closed', onClosed);
   };
-
   const onMount = () => {
     if (!elRef.current) return;
     f7ready(() => {
@@ -79,21 +71,17 @@ const LoginScreen = /*#__PURE__*/forwardRef((props, ref) => {
       if ('containerEl' in props) loginScreenParams.containerEl = containerEl;
       f7LoginScreen.current = f7.loginScreen.create(loginScreenParams);
       modalEvents('on');
-
       if (opened) {
         f7LoginScreen.current.open(false);
       }
     });
   };
-
   const onDestroy = () => {
     if (f7LoginScreen.current) {
       f7LoginScreen.current.destroy();
     }
-
     f7LoginScreen.current = null;
   };
-
   useIsomorphicLayoutEffect(() => {
     modalEvents('on');
     return () => {

package/components/message.js

@@ -1,9 +1,9 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React, { forwardRef, useRef, useImperativeHandle } from 'react';
 import { classNames, getExtraAttrs, getSlots, emit } from '../shared/utils.js';
 import { colorClasses } from '../shared/mixins.js';
 
+
 const Message = /*#__PURE__*/forwardRef((props, ref) => {
   const {
     className,
@@ -29,35 +29,27 @@ const Message = /*#__PURE__*/forwardRef((props, ref) => {
   } = props;
   const extraAttrs = getExtraAttrs(props);
   const elRef = useRef(null);
-
   const onClick = event => {
     emit(props, 'click', event);
   };
-
   const onNameClick = event => {
     emit(props, 'clickName', event);
   };
-
   const onTextClick = event => {
     emit(props, 'clickText', event);
   };
-
   const onAvatarClick = event => {
     emit(props, 'clickAvatar', event);
   };
-
   const onHeaderClick = event => {
     emit(props, 'clickHeader', event);
   };
-
   const onFooterClick = event => {
     emit(props, 'clickFooter', event);
   };
-
   const onBubbleClick = event => {
     emit(props, 'clickBubble', event);
   };
-
   useImperativeHandle(ref, () => ({
     el: elRef.current
   }));

package/components/messagebar-attachment.js

@@ -1,9 +1,9 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React, { forwardRef, useRef, useImperativeHandle } from 'react';
 import { classNames, getExtraAttrs, emit } from '../shared/utils.js';
 import { colorClasses } from '../shared/mixins.js';
 
+
 const MessagebarAttachment = /*#__PURE__*/forwardRef((props, ref) => {
   const {
     className,
@@ -15,15 +15,12 @@ const MessagebarAttachment = /*#__PURE__*/forwardRef((props, ref) => {
   } = props;
   const extraAttrs = getExtraAttrs(props);
   const elRef = useRef(null);
-
   const onClick = event => {
     emit(props, 'attachmentClick', event);
   };
-
   const onDeleteClick = event => {
     emit(props, 'attachmentDelete', event);
   };
-
   useImperativeHandle(ref, () => ({
     el: elRef.current
   }));

package/components/messagebar-attachments.js

@@ -1,9 +1,9 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React, { forwardRef, useRef, useImperativeHandle } from 'react';
 import { classNames, getExtraAttrs } from '../shared/utils.js';
 import { colorClasses } from '../shared/mixins.js';
 
+
 const MessagebarAttachments = /*#__PURE__*/forwardRef((props, ref) => {
   const {
     className,

package/components/messagebar-sheet-image.js

@@ -1,9 +1,9 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React, { forwardRef, useRef, useImperativeHandle } from 'react';
 import { classNames, getExtraAttrs, emit } from '../shared/utils.js';
 import { colorClasses } from '../shared/mixins.js';
 
+
 const MessagebarSheetImage = /*#__PURE__*/forwardRef((props, ref) => {
   const {
     className,
@@ -15,18 +15,15 @@ const MessagebarSheetImage = /*#__PURE__*/forwardRef((props, ref) => {
   } = props;
   const extraAttrs = getExtraAttrs(props);
   const elRef = useRef(null);
-
   const onChange = event => {
     if (event.target.checked) emit(props, 'checked', event);else emit(props, 'unchecked', event);
     emit(props, 'change', event);
   };
-
   useImperativeHandle(ref, () => ({
     el: elRef.current
   }));
   const classes = classNames(className, 'messagebar-sheet-image', 'checkbox', colorClasses(props));
   const styles = {
-    backgroundImage: image && `url(${image})`,
     ...(style || {})
   };
   return /*#__PURE__*/React.createElement("label", _extends({
@@ -40,6 +37,8 @@ const MessagebarSheetImage = /*#__PURE__*/forwardRef((props, ref) => {
     onChange: onChange
   }), /*#__PURE__*/React.createElement("i", {
     className: "icon icon-checkbox"
+  }), image && /*#__PURE__*/React.createElement("img", {
+    src: image
   }), children);
 });
 MessagebarSheetImage.displayName = 'f7-messagebar-sheet-image';

package/components/messagebar-sheet-item.js

@@ -1,9 +1,9 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React, { forwardRef, useRef, useImperativeHandle } from 'react';
 import { classNames, getExtraAttrs } from '../shared/utils.js';
 import { colorClasses } from '../shared/mixins.js';
 
+
 const MessagebarSheetItem = /*#__PURE__*/forwardRef((props, ref) => {
   const {
     className,

package/components/messagebar-sheet.js

@@ -1,9 +1,9 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React, { forwardRef, useRef, useImperativeHandle } from 'react';
 import { classNames, getExtraAttrs } from '../shared/utils.js';
 import { colorClasses } from '../shared/mixins.js';
 
+
 const MessagebarSheet = /*#__PURE__*/forwardRef((props, ref) => {
   const {
     className,

package/components/messagebar.js

@@ -1,5 +1,4 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React, { forwardRef, useRef, useImperativeHandle } from 'react';
 import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
 import { classNames, getExtraAttrs, emit, getSlots, noUndefinedProps } from '../shared/utils.js';
@@ -38,23 +37,18 @@ const Messagebar = /*#__PURE__*/forwardRef((props, ref) => {
   const extraAttrs = getExtraAttrs(props);
   const elRef = useRef(null);
   const areaElRef = useRef(null);
-
   const onChange = event => {
     emit(props, 'change', event);
   };
-
   const onInput = event => {
     emit(props, 'input', event);
   };
-
   const onFocus = event => {
     emit(props, 'focus', event);
   };
-
   const onBlur = event => {
     emit(props, 'blur', event);
   };
-
   const onClick = event => {
     const inputValue = areaElRef.current.el.value;
     const clear = f7Messagebar.current ? () => {
@@ -64,19 +58,15 @@ const Messagebar = /*#__PURE__*/forwardRef((props, ref) => {
     emit(props, 'send', inputValue, clear);
     emit(props, 'click', event);
   };
-
   const onAttachmentDelete = (instance, attachmentEl, attachmentElIndex) => {
     emit(props, 'messagebarAttachmentDelete', instance, attachmentEl, attachmentElIndex);
   };
-
   const onAttachmentClick = (instance, attachmentEl, attachmentElIndex) => {
     emit(props, 'messagebarAttachmentClick', instance, attachmentEl, attachmentElIndex);
   };
-
   const onResizePage = instance => {
     emit(props, 'messagebarResizePage', instance);
   };
-
   useImperativeHandle(ref, () => ({
     el: elRef.current,
     f7Messagebar: () => f7Messagebar.current
@@ -91,20 +81,17 @@ const Messagebar = /*#__PURE__*/forwardRef((props, ref) => {
   });
   useIsomorphicLayoutEffect(() => {
     if (!f7Messagebar.current) return;
-
     if (updateSheetVisible.current) {
       updateSheetVisible.current = false;
       f7Messagebar.current.sheetVisible = sheetVisible;
       f7Messagebar.current.resizePage();
     }
-
     if (updateAttachmentsVisible.current) {
       updateAttachmentsVisible.current = false;
       f7Messagebar.current.attachmentsVisible = attachmentsVisible;
       f7Messagebar.current.resizePage();
     }
   });
-
   const onMount = () => {
     if (!init) return;
     if (!elRef.current) return;
@@ -125,12 +112,10 @@ const Messagebar = /*#__PURE__*/forwardRef((props, ref) => {
       f7Messagebar.current = f7.messagebar.create(params);
     });
   };
-
   const onDestroy = () => {
     if (f7Messagebar.current && f7Messagebar.current.destroy) f7Messagebar.current.destroy();
     f7Messagebar.current = null;
   };
-
   useIsomorphicLayoutEffect(() => {
     onMount();
     return onDestroy;
@@ -149,12 +134,10 @@ const Messagebar = /*#__PURE__*/forwardRef((props, ref) => {
   const innerEndEls = [];
   let messagebarAttachmentsEl;
   let messagebarSheetEl;
-
   if (slotsDefault) {
     slotsDefault.forEach(child => {
       if (typeof child === 'undefined') return;
       const tag = child.type && (child.type.displayName || child.type.name);
-
       if (tag && (tag.indexOf('messagebar-attachments') >= 0 || tag === 'F7MessagebarAttachments' || tag === 'f7-messagebar-attachments')) {
         messagebarAttachmentsEl = child;
       } else if (tag && (tag.indexOf('messagebar-sheet') >= 0 || tag === 'F7MessagebarSheet' || tag === 'f7-messagebar-sheet')) {
@@ -164,7 +147,6 @@ const Messagebar = /*#__PURE__*/forwardRef((props, ref) => {
       }
     });
   }
-
   const valueProps = {};
   if ('value' in props) valueProps.value = value;
   const classes = classNames(className, 'toolbar', 'messagebar', {

package/components/messages-title.js

@@ -1,9 +1,9 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React, { forwardRef, useRef, useImperativeHandle } from 'react';
 import { classNames, getExtraAttrs } from '../shared/utils.js';
 import { colorClasses } from '../shared/mixins.js';
 
+
 const MessagesTitle = /*#__PURE__*/forwardRef((props, ref) => {
   const {
     className,