framework7-vue 6.3.15 → 7.0.0-beta.11

package/components/app.js

@@ -0,0 +1,292 @@
+import { renderSlot as _renderSlot, resolveComponent as _resolveComponent, createVNode as _createVNode, openBlock as _openBlock, createBlock as _createBlock } from "vue";
+
+function render(_ctx, _cache) {
+  const _component_routable_modals = _resolveComponent("routable-modals");
+
+  return _openBlock(), _createBlock("div", {
+    id: "framework7-root",
+    ref: "elRef",
+    class: _ctx.classes
+  }, [_renderSlot(_ctx.$slots, "default"), _createVNode(_component_routable_modals)], 2);
+}
+
+import { ref, onMounted, computed, toRaw } from 'vue';
+import { classNames, noUndefinedProps } from '../shared/utils.js';
+import { colorClasses, colorProps } from '../shared/mixins.js';
+import RoutableModals from './routable-modals.js';
+import { f7init, f7 } from '../shared/f7.js';
+export default {
+  name: 'f7-app',
+  render,
+  components: {
+    RoutableModals
+  },
+  inheritAttrs: false,
+  props: {
+    id: {
+      type: String,
+      default: undefined
+    },
+    name: {
+      type: String,
+      default: undefined
+    },
+    version: {
+      type: String,
+      default: undefined
+    },
+    theme: {
+      type: String,
+      default: undefined
+    },
+    language: {
+      type: String,
+      default: undefined
+    },
+    routes: {
+      type: Array,
+      default: () => []
+    },
+    store: Object,
+    autoDarkMode: {
+      type: Boolean,
+      default: undefined
+    },
+    lazyModulesPath: {
+      type: String,
+      default: undefined
+    },
+    initOnDeviceReady: {
+      type: Boolean,
+      default: undefined
+    },
+    iosTranslucentBars: {
+      type: Boolean,
+      default: undefined
+    },
+    iosTranslucentModals: {
+      type: Boolean,
+      default: undefined
+    },
+    userAgent: {
+      type: String,
+      default: undefined
+    },
+    url: {
+      type: String,
+      default: undefined
+    },
+    // components
+    accordion: {
+      type: Object,
+      default: () => undefined
+    },
+    actions: {
+      type: Object,
+      default: () => undefined
+    },
+    areaChart: {
+      type: Object,
+      default: () => undefined
+    },
+    autocomplete: {
+      type: Object,
+      default: () => undefined
+    },
+    calendar: {
+      type: Object,
+      default: () => undefined
+    },
+    card: {
+      type: Object,
+      default: () => undefined
+    },
+    colorPicker: {
+      type: Object,
+      default: () => undefined
+    },
+    dialog: {
+      type: Object,
+      default: () => undefined
+    },
+    form: {
+      type: Object,
+      default: () => undefined
+    },
+    gauge: {
+      type: Object,
+      default: () => undefined
+    },
+    grid: {
+      type: Object,
+      default: () => undefined
+    },
+    infiniteScroll: {
+      type: Object,
+      default: () => undefined
+    },
+    input: {
+      type: Object,
+      default: () => undefined
+    },
+    lazy: {
+      type: Object,
+      default: () => undefined
+    },
+    listIndex: {
+      type: Object,
+      default: () => undefined
+    },
+    loginScreen: {
+      type: Object,
+      default: () => undefined
+    },
+    messagebar: {
+      type: Object,
+      default: () => undefined
+    },
+    messages: {
+      type: Object,
+      default: () => undefined
+    },
+    navbar: {
+      type: Object,
+      default: () => undefined
+    },
+    notification: {
+      type: Object,
+      default: () => undefined
+    },
+    panel: {
+      type: Object,
+      default: () => undefined
+    },
+    photoBrowser: {
+      type: Object,
+      default: () => undefined
+    },
+    picker: {
+      type: Object,
+      default: () => undefined
+    },
+    pieChart: {
+      type: Object,
+      default: () => undefined
+    },
+    popover: {
+      type: Object,
+      default: () => undefined
+    },
+    popup: {
+      type: Object,
+      default: () => undefined
+    },
+    range: {
+      type: Object,
+      default: () => undefined
+    },
+    searchbar: {
+      type: Object,
+      default: () => undefined
+    },
+    sheet: {
+      type: Object,
+      default: () => undefined
+    },
+    smartSelect: {
+      type: Object,
+      default: () => undefined
+    },
+    sortable: {
+      type: Object,
+      default: () => undefined
+    },
+    statusbar: {
+      type: Object,
+      default: () => undefined
+    },
+    stepper: {
+      type: Object,
+      default: () => undefined
+    },
+    swipeout: {
+      type: Object,
+      default: () => undefined
+    },
+    textEditor: {
+      type: Object,
+      default: () => undefined
+    },
+    toast: {
+      type: Object,
+      default: () => undefined
+    },
+    toolbar: {
+      type: Object,
+      default: () => undefined
+    },
+    tooltip: {
+      type: Object,
+      default: () => undefined
+    },
+    view: {
+      type: Object,
+      default: () => undefined
+    },
+    virtualList: {
+      type: Object,
+      default: () => undefined
+    },
+    // modules
+    clicks: {
+      type: Object,
+      default: () => undefined
+    },
+    serviceWorker: {
+      type: Object,
+      default: () => undefined
+    },
+    touch: {
+      type: Object,
+      default: () => undefined
+    },
+    ...colorProps
+  },
+
+  setup(props) {
+    const elRef = ref(null);
+    const routes = toRaw(props.routes);
+
+    if (!f7 || typeof window === 'undefined') {
+      f7init(elRef.value, noUndefinedProps({ ...props,
+        routes
+      }), false);
+    }
+
+    onMounted(() => {
+      const parentEl = elRef.value && elRef.value.parentNode;
+      /* eslint-disable no-restricted-globals */
+
+      if (typeof document !== 'undefined' && parentEl && parentEl !== document.body && parentEl.parentNode === document.body) {
+        parentEl.style.height = '100%';
+      }
+      /* eslint-enable no-restricted-globals */
+
+
+      if (f7) {
+        f7.init(elRef.value);
+        return;
+      }
+
+      f7init(elRef.value, noUndefinedProps({ ...props,
+        routes
+      }), true);
+    });
+    const classes = computed(() => classNames('framework7-root', colorClasses(props)));
+    return {
+      classes,
+      elRef
+    };
+  }
+
+};

package/components/appbar.js

@@ -0,0 +1,44 @@
+import { renderSlot as _renderSlot, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode } from "vue";
+
+function render(_ctx, _cache) {
+  return _openBlock(), _createBlock("div", {
+    class: _ctx.classes
+  }, [_renderSlot(_ctx.$slots, "before-inner"), _ctx.inner ? (_openBlock(), _createBlock("div", {
+    key: 0,
+    class: _ctx.innerClasses
+  }, [_renderSlot(_ctx.$slots, "default")], 2)) : _renderSlot(_ctx.$slots, "default", {
+    key: 1
+  }), _renderSlot(_ctx.$slots, "after-inner")], 2);
+}
+
+import { computed } from 'vue';
+import { classNames } from '../shared/utils.js';
+import { colorClasses, colorProps } from '../shared/mixins.js';
+export default {
+  name: 'f7-appbar',
+  render,
+  props: {
+    noShadow: Boolean,
+    noHairline: Boolean,
+    inner: {
+      type: Boolean,
+      default: true
+    },
+    innerClass: String,
+    innerClassName: String,
+    ...colorProps
+  },
+
+  setup(props) {
+    const classes = computed(() => classNames('appbar', {
+      'no-shadow': props.noShadow,
+      'no-hairline': props.noHairline
+    }, colorClasses(props)));
+    const innerClasses = computed(() => classNames('appbar-inner', props.innerClass, props.innerClassName));
+    return {
+      classes,
+      innerClasses
+    };
+  }
+
+};