framework7-react 7.0.0-beta.1 → 7.0.0-beta.10

package/shared/router-open-in.js

@@ -0,0 +1,106 @@
+import React from 'react';
+import Popup from '../components/popup.js';
+import View from '../components/view.js';
+import LoginScreen from '../components/login-screen.js';
+import Sheet from '../components/sheet.js';
+import Popover from '../components/popover.js';
+import Panel from '../components/panel.js';
+export const routerOpenIn = (router, url, options) => {
+  const navigateOptions = {
+    url,
+    route: {
+      path: url,
+      options: { ...options,
+        openIn: undefined
+      }
+    }
+  };
+  const params = { ...options
+  };
+
+  if (options.openIn === 'popup') {
+    params.component = function DynamicPopup() {
+      return /*#__PURE__*/React.createElement(Popup, {
+        className: "popup-router-open-in",
+        "data-url": url
+      }, /*#__PURE__*/React.createElement(View, {
+        linksView: router.view.selector,
+        url: url,
+        ignoreOpenIn: true
+      }));
+    };
+
+    navigateOptions.route.popup = params;
+  }
+
+  if (options.openIn === 'loginScreen') {
+    params.component = function DynamicPopover() {
+      return /*#__PURE__*/React.createElement(LoginScreen, {
+        className: "login-screen-router-open-in",
+        "data-url": url
+      }, /*#__PURE__*/React.createElement(View, {
+        linksView: router.view.selector,
+        url: url,
+        ignoreOpenIn: true
+      }));
+    };
+
+    navigateOptions.route.loginScreen = params;
+  }
+
+  if (options.openIn === 'sheet') {
+    params.component = function DynamicSheet() {
+      return /*#__PURE__*/React.createElement(Sheet, {
+        className: "sheet-modal-router-open-in",
+        "data-url": url
+      }, /*#__PURE__*/React.createElement(View, {
+        linksView: router.view.selector,
+        url: url,
+        ignoreOpenIn: true
+      }));
+    };
+
+    navigateOptions.route.sheet = params;
+  }
+
+  if (options.openIn === 'popover') {
+    params.targetEl = options.clickedEl || options.targetEl;
+
+    params.component = function DynamicPopover() {
+      return /*#__PURE__*/React.createElement(Popover, {
+        className: "popover-router-open-in",
+        targetEl: options.clickedEl || options.targetEl,
+        "data-url": url
+      }, /*#__PURE__*/React.createElement(View, {
+        linksView: router.view.selector,
+        url: url,
+        ignoreOpenIn: true
+      }));
+    };
+
+    navigateOptions.route.popover = params;
+  }
+
+  if (options.openIn.indexOf('panel') >= 0) {
+    const parts = options.openIn.split(':');
+    const side = parts[1] || 'left';
+    const effect = parts[2] || 'cover';
+
+    params.component = function DynamicPanel() {
+      return /*#__PURE__*/React.createElement(Panel, {
+        side: side,
+        effect: effect,
+        className: "panel-router-open-in",
+        "data-url": url
+      }, /*#__PURE__*/React.createElement(View, {
+        linksView: router.view.selector,
+        url: url,
+        ignoreOpenIn: true
+      }));
+    };
+
+    navigateOptions.route.panel = params;
+  }
+
+  return router.navigate(navigateOptions);
+};

package/shared/use-icon.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import Icon from '../components/icon';
-import Badge from '../components/badge';
+import Icon from '../components/icon.js';
+import Badge from '../components/badge.js';
 export const useIcon = (props = {}) => {
   const {
     icon,

package/shared/use-smart-select.js

@@ -1,6 +1,6 @@
 import { useEffect } from 'react';
-import { f7ready, f7 } from './f7';
-import { extend } from './utils';
+import { f7ready, f7 } from './f7.js';
+import { extend } from './utils.js';
 export const useSmartSelect = (smartSelect, smartSelectParams, f7SmartSelect, getEl) => {
   const onMount = () => {
     f7ready(() => {

package/shared/use-store.js

@@ -1,5 +1,5 @@
 import { useState, useEffect, useRef } from 'react';
-import { f7 } from './f7';
+import { f7 } from './f7.js';
 export const useStore = (...args) => {
   const assignedGetters = useRef({}); // (store, getter)
 

package/shared/use-tab.js

@@ -1,6 +1,6 @@
-import { useIsomorphicLayoutEffect } from './use-isomorphic-layout-effect';
-import { f7, f7ready } from './f7';
-import { emit } from './utils';
+import { useIsomorphicLayoutEffect } from './use-isomorphic-layout-effect.js';
+import { f7, f7ready } from './f7.js';
+import { emit } from './utils.js';
 export const useTab = (elRef, props) => {
   const onTabShow = el => {
     if (elRef.current !== el) return;

package/shared/use-theme.js

@@ -1,5 +1,5 @@
 import { useState } from 'react';
-import { f7, f7ready, theme } from './f7';
+import { f7, f7ready, theme } from './f7.js';
 export const useTheme = () => {
   const [t, setTheme] = useState(f7 ? theme : null);
 

package/shared/use-tooltip.js

@@ -1,6 +1,6 @@
 import { useEffect, useRef } from 'react';
-import { watchProp } from './watch-prop';
-import { f7, f7ready } from './f7';
+import { watchProp } from './watch-prop.js';
+import { f7, f7ready } from './f7.js';
 export const useTooltip = (elRef, props) => {
   const f7Tooltip = useRef(null);
   const {

package/shared/watch-prop.js

@@ -1,5 +1,5 @@
 import { useRef } from 'react';
-import { useIsomorphicLayoutEffect } from './use-isomorphic-layout-effect';
+import { useIsomorphicLayoutEffect } from './use-isomorphic-layout-effect.js';
 export const watchProp = (value, callback) => {
   const valueRef = useRef(value);
   useIsomorphicLayoutEffect(() => {