framework7 6.3.4 → 7.0.0-beta.3

package/cjs/components/actions/actions-class.js

@@ -1,383 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.default = void 0;
-
-var _ssrWindow = require("ssr-window");
-
-var _getDevice = require("../../shared/get-device");
-
-var _utils = require("../../shared/utils");
-
-var _modalClass = _interopRequireDefault(require("../modal/modal-class"));
-
-var _dom = _interopRequireDefault(require("../../shared/dom7"));
-
-var _$jsx = _interopRequireDefault(require("../../shared/$jsx"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-
-function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
-
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-
-var Actions = /*#__PURE__*/function (_Modal) {
-  _inheritsLoose(Actions, _Modal);
-
-  function Actions(app, params) {
-    var _this;
-
-    var extendedParams = (0, _utils.extend)({
-      on: {}
-    }, app.params.actions, params); // Extends with open/close Modal methods;
-
-    _this = _Modal.call(this, app, extendedParams) || this;
-
-    var actions = _assertThisInitialized(_this);
-
-    var device = (0, _getDevice.getDevice)();
-    var window = (0, _ssrWindow.getWindow)();
-    var document = (0, _ssrWindow.getDocument)();
-    actions.params = extendedParams; // Buttons
-
-    var groups;
-
-    if (actions.params.buttons) {
-      groups = actions.params.buttons;
-      if (!Array.isArray(groups[0])) groups = [groups];
-    }
-
-    actions.groups = groups; // Find Element
-
-    var $el;
-
-    if (actions.params.el) {
-      $el = (0, _dom.default)(actions.params.el).eq(0);
-    } else if (actions.params.content) {
-      $el = (0, _dom.default)(actions.params.content).filter(function (node) {
-        return node.nodeType === 1;
-      }).eq(0);
-    } else if (actions.params.buttons) {
-      if (actions.params.convertToPopover) {
-        actions.popoverHtml = actions.renderPopover();
-      }
-
-      actions.actionsHtml = actions.render();
-    }
-
-    if ($el && $el.length > 0 && $el[0].f7Modal) {
-      return $el[0].f7Modal || _assertThisInitialized(_this);
-    }
-
-    if ($el && $el.length === 0 && !(actions.actionsHtml || actions.popoverHtml)) {
-      return actions.destroy() || _assertThisInitialized(_this);
-    } // Backdrop
-
-
-    var $backdropEl;
-
-    if (actions.params.backdrop && actions.params.backdropEl) {
-      $backdropEl = (0, _dom.default)(actions.params.backdropEl);
-    } else if (actions.params.backdrop) {
-      $backdropEl = actions.$containerEl.children('.actions-backdrop');
-
-      if ($backdropEl.length === 0) {
-        $backdropEl = (0, _dom.default)('<div class="actions-backdrop"></div>');
-        actions.$containerEl.append($backdropEl);
-      }
-    }
-
-    var originalOpen = actions.open;
-    var originalClose = actions.close;
-    var popover;
-
-    function buttonOnClick(e) {
-      var $buttonEl = (0, _dom.default)(this);
-      var buttonIndex;
-      var groupIndex;
-
-      if ($buttonEl.hasClass('list-button') || $buttonEl.hasClass('item-link')) {
-        buttonIndex = $buttonEl.parents('li').index();
-        groupIndex = $buttonEl.parents('.list').index();
-      } else {
-        buttonIndex = $buttonEl.index();
-        groupIndex = $buttonEl.parents('.actions-group').index();
-      }
-
-      if (typeof groups !== 'undefined') {
-        var button = groups[groupIndex][buttonIndex];
-        if (button.onClick) button.onClick(actions, e);
-        if (actions.params.onClick) actions.params.onClick(actions, e);
-        if (button.close !== false) actions.close();
-      }
-    }
-
-    actions.open = function open(animate) {
-      var convertToPopover = false;
-      var _actions$params = actions.params,
-          targetEl = _actions$params.targetEl,
-          targetX = _actions$params.targetX,
-          targetY = _actions$params.targetY,
-          targetWidth = _actions$params.targetWidth,
-          targetHeight = _actions$params.targetHeight;
-
-      if (actions.params.convertToPopover && (targetEl || targetX !== undefined && targetY !== undefined)) {
-        // Popover
-        if (actions.params.forceToPopover || device.ios && device.ipad || app.width >= 768 || device.desktop && app.theme === 'aurora') {
-          convertToPopover = true;
-        }
-      }
-
-      if (convertToPopover && actions.popoverHtml) {
-        popover = app.popover.create({
-          containerEl: actions.params.containerEl,
-          content: actions.popoverHtml,
-          backdrop: actions.params.backdrop,
-          targetEl: targetEl,
-          targetX: targetX,
-          targetY: targetY,
-          targetWidth: targetWidth,
-          targetHeight: targetHeight,
-          on: {
-            open: function open() {
-              if (!actions.$el) {
-                actions.$el = popover.$el;
-              }
-
-              actions.$el.trigger("modal:open " + actions.type.toLowerCase() + ":open");
-              actions.emit("local::open modalOpen " + actions.type + "Open", actions);
-            },
-            opened: function opened() {
-              if (!actions.$el) {
-                actions.$el = popover.$el;
-              }
-
-              actions.$el.trigger("modal:opened " + actions.type.toLowerCase() + ":opened");
-              actions.emit("local::opened modalOpened " + actions.type + "Opened", actions);
-            },
-            close: function close() {
-              if (!actions.$el) {
-                actions.$el = popover.$el;
-              }
-
-              actions.$el.trigger("modal:close " + actions.type.toLowerCase() + ":close");
-              actions.emit("local::close modalClose " + actions.type + "Close", actions);
-            },
-            closed: function closed() {
-              if (!actions.$el) {
-                actions.$el = popover.$el;
-              }
-
-              actions.$el.trigger("modal:closed " + actions.type.toLowerCase() + ":closed");
-              actions.emit("local::closed modalClosed " + actions.type + "Closed", actions);
-            }
-          }
-        });
-        popover.open(animate);
-        popover.once('popoverOpened', function () {
-          popover.$el.find('.list-button, .item-link').each(function (buttonEl) {
-            (0, _dom.default)(buttonEl).on('click', buttonOnClick);
-          });
-        });
-        popover.once('popoverClosed', function () {
-          popover.$el.find('.list-button, .item-link').each(function (buttonEl) {
-            (0, _dom.default)(buttonEl).off('click', buttonOnClick);
-          });
-          (0, _utils.nextTick)(function () {
-            popover.destroy();
-            popover = undefined;
-          });
-        });
-      } else {
-        actions.$el = actions.actionsHtml ? (0, _dom.default)(actions.actionsHtml) : actions.$el;
-        actions.$el[0].f7Modal = actions;
-
-        if (actions.groups) {
-          actions.$el.find('.actions-button').each(function (buttonEl) {
-            (0, _dom.default)(buttonEl).on('click', buttonOnClick);
-          });
-          actions.once('actionsClosed', function () {
-            actions.$el.find('.actions-button').each(function (buttonEl) {
-              (0, _dom.default)(buttonEl).off('click', buttonOnClick);
-            });
-          });
-        }
-
-        actions.el = actions.$el[0];
-        originalOpen.call(actions, animate);
-      }
-
-      return actions;
-    };
-
-    actions.close = function close(animate) {
-      if (popover) {
-        popover.close(animate);
-      } else {
-        originalClose.call(actions, animate);
-      }
-
-      return actions;
-    };
-
-    (0, _utils.extend)(actions, {
-      app: app,
-      $el: $el,
-      el: $el ? $el[0] : undefined,
-      $backdropEl: $backdropEl,
-      backdropEl: $backdropEl && $backdropEl[0],
-      type: 'actions'
-    });
-
-    function handleClick(e) {
-      var target = e.target;
-      var $target = (0, _dom.default)(target);
-      var keyboardOpened = !device.desktop && device.cordova && (window.Keyboard && window.Keyboard.isVisible || window.cordova.plugins && window.cordova.plugins.Keyboard && window.cordova.plugins.Keyboard.isVisible);
-      if (keyboardOpened) return;
-
-      if ($target.closest(actions.el).length === 0) {
-        if (actions.params.closeByBackdropClick && actions.params.backdrop && actions.backdropEl && actions.backdropEl === target) {
-          actions.close();
-        } else if (actions.params.closeByOutsideClick) {
-          actions.close();
-        }
-      }
-    }
-
-    function onKeyDown(e) {
-      var keyCode = e.keyCode;
-
-      if (keyCode === 27 && actions.params.closeOnEscape) {
-        actions.close();
-      }
-    }
-
-    if (actions.params.closeOnEscape) {
-      actions.on('open', function () {
-        (0, _dom.default)(document).on('keydown', onKeyDown);
-      });
-      actions.on('close', function () {
-        (0, _dom.default)(document).off('keydown', onKeyDown);
-      });
-    }
-
-    actions.on('opened', function () {
-      if (actions.params.closeByBackdropClick || actions.params.closeByOutsideClick) {
-        app.on('click', handleClick);
-      }
-    });
-    actions.on('close', function () {
-      if (actions.params.closeByBackdropClick || actions.params.closeByOutsideClick) {
-        app.off('click', handleClick);
-      }
-    });
-
-    if ($el) {
-      $el[0].f7Modal = actions;
-    }
-
-    return actions || _assertThisInitialized(_this);
-  }
-
-  var _proto = Actions.prototype;
-
-  _proto.render = function render() {
-    var actions = this;
-    if (actions.params.render) return actions.params.render.call(actions, actions);
-    var groups = actions.groups;
-    var cssClass = actions.params.cssClass;
-    return (0, _$jsx.default)("div", {
-      class: "actions-modal" + (actions.params.grid ? ' actions-grid' : '') + " " + (cssClass || '')
-    }, groups.map(function (group) {
-      return (0, _$jsx.default)("div", {
-        class: "actions-group"
-      }, group.map(function (button) {
-        var buttonClasses = ["actions-" + (button.label ? 'label' : 'button')];
-        var color = button.color,
-            bg = button.bg,
-            bold = button.bold,
-            disabled = button.disabled,
-            label = button.label,
-            text = button.text,
-            icon = button.icon;
-        if (color) buttonClasses.push("color-" + color);
-        if (bg) buttonClasses.push("bg-color-" + bg);
-        if (bold) buttonClasses.push('actions-button-bold');
-        if (disabled) buttonClasses.push('disabled');
-
-        if (label) {
-          return (0, _$jsx.default)("div", {
-            class: buttonClasses.join(' ')
-          }, text);
-        }
-
-        return (0, _$jsx.default)("div", {
-          class: buttonClasses.join(' ')
-        }, icon && (0, _$jsx.default)("div", {
-          class: "actions-button-media"
-        }, icon), (0, _$jsx.default)("div", {
-          class: "actions-button-text"
-        }, text));
-      }));
-    }));
-  };
-
-  _proto.renderPopover = function renderPopover() {
-    var actions = this;
-    if (actions.params.renderPopover) return actions.params.renderPopover.call(actions, actions);
-    var groups = actions.groups;
-    var cssClass = actions.params.cssClass;
-    return (0, _$jsx.default)("div", {
-      class: "popover popover-from-actions " + (cssClass || '')
-    }, (0, _$jsx.default)("div", {
-      class: "popover-inner"
-    }, groups.map(function (group) {
-      return (0, _$jsx.default)("div", {
-        class: "list"
-      }, (0, _$jsx.default)("ul", null, group.map(function (button) {
-        var itemClasses = [];
-        var color = button.color,
-            bg = button.bg,
-            bold = button.bold,
-            disabled = button.disabled,
-            label = button.label,
-            text = button.text,
-            icon = button.icon;
-        if (color) itemClasses.push("color-" + color);
-        if (bg) itemClasses.push("bg-color-" + bg);
-        if (bold) itemClasses.push('popover-from-actions-bold');
-        if (disabled) itemClasses.push('disabled');
-
-        if (label) {
-          itemClasses.push('popover-from-actions-label');
-          return "<li class=\"" + itemClasses.join(' ') + "\">" + text + "</li>";
-        }
-
-        if (icon) {
-          itemClasses.push('item-link item-content');
-          return (0, _$jsx.default)("li", null, (0, _$jsx.default)("a", {
-            class: itemClasses.join(' ')
-          }, (0, _$jsx.default)("div", {
-            class: "item-media"
-          }, icon), (0, _$jsx.default)("div", {
-            class: "item-inner"
-          }, (0, _$jsx.default)("div", {
-            class: "item-title"
-          }, text))));
-        }
-
-        itemClasses.push('list-button');
-        return (0, _$jsx.default)("li", null, (0, _$jsx.default)("a", {
-          class: itemClasses.join(' ')
-        }, text));
-      })));
-    })));
-  };
-
-  return Actions;
-}(_modalClass.default);
-
-var _default = Actions;
-exports.default = _default;

package/cjs/components/actions/actions.js

@@ -1,58 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.default = void 0;
-
-var _actionsClass = _interopRequireDefault(require("./actions-class"));
-
-var _modalMethods = _interopRequireDefault(require("../../shared/modal-methods"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-var _default = {
-  name: 'actions',
-  params: {
-    actions: {
-      convertToPopover: true,
-      forceToPopover: false,
-      backdrop: true,
-      backdropEl: undefined,
-      cssClass: null,
-      closeByBackdropClick: true,
-      closeOnEscape: false,
-      render: null,
-      renderPopover: null,
-      containerEl: null
-    }
-  },
-  static: {
-    Actions: _actionsClass.default
-  },
-  create: function create() {
-    var app = this;
-    app.actions = (0, _modalMethods.default)({
-      app: app,
-      constructor: _actionsClass.default,
-      defaultSelector: '.actions-modal.modal-in'
-    });
-  },
-  clicks: {
-    '.actions-open': function openActions($clickedEl, data) {
-      if (data === void 0) {
-        data = {};
-      }
-
-      var app = this;
-      app.actions.open(data.actions, data.animate, $clickedEl);
-    },
-    '.actions-close': function closeActions($clickedEl, data) {
-      if (data === void 0) {
-        data = {};
-      }
-
-      var app = this;
-      app.actions.close(data.actions, data.animate, $clickedEl);
-    }
-  }
-};
-exports.default = _default;