framework7-vue 7.0.8 → 8.0.0-beta.1

package/components/fab-buttons.js

@@ -1,11 +1,9 @@
 import { renderSlot as _renderSlot, normalizeClass as _normalizeClass, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
-
 function render(_ctx, _cache) {
   return _openBlock(), _createElementBlock("div", {
     class: _normalizeClass(_ctx.classes)
   }, [_renderSlot(_ctx.$slots, "default")], 2);
 }
-
 import { computed } from 'vue';
 import { classNames } from '../shared/utils.js';
 import { colorClasses, colorProps } from '../shared/mixins.js';
@@ -19,12 +17,10 @@ export default {
     },
     ...colorProps
   },
-
   setup(props) {
     const classes = computed(() => classNames('fab-buttons', `fab-buttons-${props.position}`, colorClasses(props)));
     return {
       classes
     };
   }
-
 };

package/components/fab.js

@@ -18,24 +18,20 @@ export default {
     ...colorProps
   },
   emits: ['click'],
-
   setup(props, _ref) {
     let {
       emit,
       slots
     } = _ref;
     const elRef = ref(null);
-
     const onClick = e => {
       emit('click', e);
     };
-
     useTooltip(elRef, props);
     const hrefComputed = computed(() => {
       let href = props.href;
       if (href === true) href = '#';
       if (href === false) href = undefined; // no href attribute
-
       return href;
     });
     return () => {
@@ -49,7 +45,6 @@ export default {
         root: rootSlots,
         text: textSlots
       } = slots;
-
       if (defaultSlots) {
         defaultSlots().forEach(vnode => {
           if (typeof vnode === 'undefined') return;
@@ -57,13 +52,11 @@ export default {
           if (tag === 'FabButtons' || tag === 'f7-fab-buttons') rootChildren.push(vnode);else linkChildren.push(vnode);
         });
       }
-
       if (props.text || textSlots) {
         textEl = h('div', {
           class: 'fab-text'
         }, [props.text, textSlots && textSlots()]);
       }
-
       if (linkChildren.length || linkSlots || textEl) {
         linkEl = h('a', {
           target: props.target,
@@ -71,7 +64,6 @@ export default {
           onClick
         }, [linkChildren, textEl, linkSlots && linkSlots()]);
       }
-
       const classes = classNames('fab', `fab-${props.position}`, {
         'fab-morph': props.morphTo,
         'fab-extended': typeof textEl !== 'undefined'
@@ -83,5 +75,4 @@ export default {
       }, [linkEl, rootChildren, rootSlots && rootSlots()]);
     };
   }
-
 };

package/components/gauge.js

@@ -9,7 +9,6 @@ const _hoisted_5 = ["stroke", "stroke-width", "fill", "cx", "cy", "r"];
 const _hoisted_6 = ["transform", "stroke", "stroke-width", "stroke-dasharray", "stroke-dashoffset", "fill", "cx", "cy", "r"];
 const _hoisted_7 = ["y", "font-weight", "font-size", "fill", "dy", "dominant-baseline"];
 const _hoisted_8 = ["y", "font-weight", "font-size", "fill", "dy", "dominant-baseline"];
-
 function render(_ctx, _cache) {
   return _openBlock(), _createElementBlock("div", _hoisted_1, [(_openBlock(), _createElementBlock("svg", {
     class: "gauge-svg",
@@ -77,7 +76,6 @@ function render(_ctx, _cache) {
     "dominant-baseline": !_ctx.semiCircle ? 'middle' : null
   }, _toDisplayString(_ctx.labelText), 9, _hoisted_8)) : _createCommentVNode("", true)], 8, _hoisted_2))]);
 }
-
 import { computed } from 'vue';
 export default {
   name: 'f7-gauge',
@@ -138,7 +136,6 @@ export default {
       default: 400
     }
   },
-
   setup(props) {
     const semiCircle = computed(() => props.type === 'semicircle');
     const radius = computed(() => props.size / 2 - props.borderWidth / 2);
@@ -151,5 +148,4 @@ export default {
       progress
     };
   }
-
 };

package/components/icon.d.ts

@@ -21,10 +21,6 @@ declare const Icon: DefineComponent<
       type: StringConstructor;
     },
 
-    aurora: {
-      type: StringConstructor;
-    },
-
     md: {
       type: StringConstructor;
     },

package/components/icon.js

@@ -1,5 +1,4 @@
 import { toDisplayString as _toDisplayString, renderSlot as _renderSlot, createTextVNode as _createTextVNode, normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
-
 function render(_ctx, _cache) {
   return _openBlock(), _createElementBlock("i", {
     ref: "elRef",
@@ -11,7 +10,6 @@ function render(_ctx, _cache) {
     class: _normalizeClass(_ctx.classesComputed)
   }, [_createTextVNode(_toDisplayString(_ctx.iconText) + " ", 1), _renderSlot(_ctx.$slots, "default")], 6);
 }
-
 import { ref, computed } from 'vue';
 import { classNames } from '../shared/utils.js';
 import { colorClasses, colorProps } from '../shared/mixins.js';
@@ -25,14 +23,12 @@ export default {
     f7: String,
     icon: String,
     ios: String,
-    aurora: String,
     md: String,
     tooltip: String,
     tooltipTrigger: String,
     size: [String, Number],
     ...colorProps
   },
-
   setup(props) {
     const elRef = ref(null);
     const theme = useTheme();
@@ -41,7 +37,6 @@ export default {
       const {
         ios,
         md,
-        aurora,
         f7,
         material,
         icon
@@ -50,18 +45,15 @@ export default {
         icon: true
       };
       let themeIcon;
-      if (theme.value && theme.value.ios) themeIcon = ios;else if (theme.value && theme.value.md) themeIcon = md;else if (theme.value && theme.value.aurora) themeIcon = aurora;
-
+      if (theme.value && theme.value.ios) themeIcon = ios;else if (theme.value && theme.value.md) themeIcon = md;
       if (themeIcon) {
         const parts = themeIcon.split(':');
         const prop = parts[0];
         const value = parts[1];
-
         if (prop === 'material' || prop === 'f7') {
           classes['material-icons'] = prop === 'material';
           classes['f7-icons'] = prop === 'f7';
         }
-
         if (prop === 'icon') {
           classes[value] = true;
         }
@@ -73,36 +65,28 @@ export default {
         };
         if (icon) classes[icon] = true;
       }
-
       return classNames(classes, colorClasses(props));
     });
     const sizeComputed = computed(() => {
       let size = props.size;
-
       if (typeof props.size === 'number' || parseFloat(props.size) === props.size * 1) {
         size = `${props.size}px`;
       }
-
       return size;
     });
     const iconText = computed(() => {
       const {
         ios,
         md,
-        aurora,
         f7,
         material
       } = props;
       let text = material || f7;
-
       if (md && theme.value && theme.value.md && (md.indexOf('material:') >= 0 || md.indexOf('f7:') >= 0)) {
         text = md.split(':')[1];
       } else if (ios && theme.value && theme.value.ios && (ios.indexOf('material:') >= 0 || ios.indexOf('f7:') >= 0)) {
         text = ios.split(':')[1];
-      } else if (aurora && theme.value && theme.value.aurora && (aurora.indexOf('material:') >= 0 || aurora.indexOf('f7:') >= 0)) {
-        text = aurora.split(':')[1];
       }
-
       return text;
     });
     return {
@@ -112,5 +96,4 @@ export default {
       iconText
     };
   }
-
 };

package/components/input.js

@@ -71,7 +71,6 @@ export default {
     ...colorProps
   },
   emits: ['input', 'focus', 'blur', 'change', 'textarea:resize', 'input:notempty', 'input:empty', 'input:clear', 'texteditor:change', 'calendar:change', 'colorpicker:change', 'update:value'],
-
   setup(props, _ref) {
     let {
       emit,
@@ -84,113 +83,87 @@ export default {
     const elRef = ref(null);
     const inputElRef = ref(null);
     let updateInputOnDidUpdate = false;
-
     const getDomValue = () => {
       if (!inputElRef.value) return undefined;
       return inputElRef.value.value;
     };
-
     const domValue = ref(getDomValue());
     const inputHasValue = computed(() => {
       if (props.type === 'datepicker' && Array.isArray(props.value) && props.value.length === 0) {
         return false;
       }
-
       return typeof props.value === 'undefined' ? domValue.value || domValue.value === 0 : props.value || props.value === 0;
     });
-
     const validateInput = () => {
       if (!f7 || !inputElRef.value) return;
       const validity = inputElRef.value.validity;
       if (!validity) return;
-
       if (!validity.valid) {
         if (props.onValidate) props.onValidate(false);
-
         if (inputInvalid.value !== true) {
           inputInvalid.value = true;
         }
       } else {
         if (props.onValidate) props.onValidate(true);
-
         if (inputInvalid.value !== false) {
           inputInvalid.value = false;
         }
       }
     };
-
     const onTextareaResize = event => {
       emit('textarea:resize', event);
     };
-
     const onInputNotEmpty = event => {
       emit('input:notempty', event);
     };
-
     const onInputEmpty = event => {
       emit('input:empty', event);
     };
-
     const onInputClear = event => {
       emit('input:clear', event);
     };
-
     const onInput = function () {
       for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
         args[_key] = arguments[_key];
       }
-
       emit('input', ...args);
-
       if (inputElRef.value) {
         domValue.value = inputElRef.value.value;
       }
-
       if (!(props.validateOnBlur || props.validateOnBlur === '') && (props.validate || props.validate === '') && inputElRef.value) {
         validateInput();
       }
-
       if (inputElRef.value && props.type !== 'texteditor' && props.type !== 'colorpicker' && props.type !== 'datepicker') {
         emit('update:value', inputElRef.value.value);
       }
     };
-
     const onFocus = function () {
       for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
         args[_key2] = arguments[_key2];
       }
-
       emit('focus', ...args);
       inputFocused.value = true;
     };
-
     const onBlur = function () {
       for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
         args[_key3] = arguments[_key3];
       }
-
       emit('blur', ...args);
-
       if ((props.validate || props.validate === '' || props.validateOnBlur || props.validateOnBlur === '') && inputElRef.value) {
         validateInput();
       }
-
       inputFocused.value = false;
     };
-
     const onChange = function () {
       for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
         args[_key4] = arguments[_key4];
       }
-
       emit('change', ...args);
-
       if (props.type === 'texteditor') {
         emit('texteditor:change', args[1]);
         emit('update:value', args[1]);
       }
     };
-
     onMounted(() => {
       const {
         type,
@@ -206,16 +179,13 @@ export default {
         if (type === 'range' || type === 'toggle') return;
         if (!inputElRef.value) return;
         inputElRef.value.addEventListener('input:notempty', onInputNotEmpty, false);
-
         if (type === 'textarea' && resizable) {
           inputElRef.value.addEventListener('textarea:resize', onTextareaResize, false);
         }
-
         if (clearButton) {
           inputElRef.value.addEventListener('input:empty', onInputEmpty, false);
           inputElRef.value.addEventListener('input:clear', onInputClear, false);
         }
-
         if (type === 'datepicker') {
           f7Calendar = f7.calendar.create({
             inputEl: inputElRef.value,
@@ -225,12 +195,10 @@ export default {
                 emit('calendar:change', calendarValue);
                 emit('update:value', calendarValue);
               }
-
             },
             ...(calendarParams || {})
           });
         }
-
         if (type === 'colorpicker') {
           f7ColorPicker = f7.colorPicker.create({
             inputEl: inputElRef.value,
@@ -240,20 +208,16 @@ export default {
                 emit('colorpicker:change', colorPickerValue);
                 emit('update:value', colorPickerValue);
               }
-
             },
             ...(colorPickerParams || {})
           });
         }
-
         f7.input.checkEmptyState(inputElRef.value);
-
         if (!(validateOnBlur || validateOnBlur === '') && (validate || validate === '') && typeof value !== 'undefined' && value !== null && value !== '') {
           setTimeout(() => {
             validateInput();
           }, 0);
         }
-
         if (resizable) {
           f7.input.resizeTextarea(inputElRef.value);
         }
@@ -263,21 +227,17 @@ export default {
       if (props.type === 'range' || props.type === 'toggle') return;
       if (!inputElRef.value) return;
       inputElRef.value.removeEventListener('input:notempty', onInputNotEmpty, false);
-
       if (props.type === 'textarea' && props.resizable) {
         inputElRef.value.removeEventListener('textarea:resize', onTextareaResize, false);
       }
-
       if (props.clearButton) {
         inputElRef.value.removeEventListener('input:empty', onInputEmpty, false);
         inputElRef.value.removeEventListener('input:clear', onInputClear, false);
       }
-
       if (f7Calendar && f7Calendar.destroy) {
         f7Calendar.destroy();
         f7Calendar = null;
       }
-
       if (f7ColorPicker && f7ColorPicker.destroy) {
         f7ColorPicker.destroy();
         f7ColorPicker = null;
@@ -285,16 +245,13 @@ export default {
     });
     onUpdated(() => {
       if (!f7) return;
-
       if (updateInputOnDidUpdate) {
         if (!inputElRef.value) return;
         updateInputOnDidUpdate = false;
         f7.input.checkEmptyState(inputElRef.value);
-
         if (props.validate && !props.validateOnBlur) {
           validateInput();
         }
-
         if (props.resizable) {
           f7.input.resizeTextarea(inputElRef.value);
         }
@@ -311,25 +268,20 @@ export default {
     watch(() => props.value, newValue => {
       if (props.type === 'range' || props.type === 'toggle' || !f7) return;
       updateInputOnDidUpdate = true;
-
       if (f7Calendar) {
         f7Calendar.setValue(newValue);
       }
-
       if (f7ColorPicker) {
         f7ColorPicker.setValue(newValue);
       }
     });
-
     const createInput = (InputTag, children) => {
       const needsValue = props.type !== 'file' && props.type !== 'datepicker' && props.type !== 'colorpicker';
       const needsType = InputTag === 'input';
       let inputType = props.type;
-
       if (inputType === 'datepicker' || inputType === 'colorpicker') {
         inputType = 'text';
       }
-
       const inputClassName = classNames({
         resizable: inputType === 'textarea' && props.resizable,
         'no-store-data': props.noFormStoreData || props.noStoreData || props.ignoreStoreData,
@@ -338,17 +290,13 @@ export default {
         'input-focused': inputFocused.value
       });
       let inputValue;
-
       if (needsValue) {
         if (typeof props.value !== 'undefined') inputValue = props.value;else inputValue = domValue.value;
       }
-
       const valueProps = {};
-
       if (props.type !== 'datepicker' && props.type !== 'colorpicker') {
         if ('value' in props) valueProps.value = inputValue;
       }
-
       const inputProps = noUndefinedProps({
         name: props.name,
         type: needsType ? inputType : undefined,
@@ -392,7 +340,6 @@ export default {
         ...valueProps
       }, [children]);
     };
-
     const wrapClasses = computed(() => classNames('input', {
       'input-outline': props.outline,
       'input-dropdown': props.dropdown === 'auto' ? props.type === 'select' : props.dropdown,
@@ -400,7 +347,6 @@ export default {
     }, colorClasses(props)));
     return () => {
       let inputEl;
-
       if (props.type === 'select' || props.type === 'textarea' || props.type === 'file') {
         if (props.type === 'select') {
           inputEl = createInput('select', slots.default && slots.default());
@@ -447,7 +393,6 @@ export default {
       } else {
         inputEl = createInput('input');
       }
-
       if (!props.wrap) return inputEl;
       return h('div', {
         class: wrapClasses.value,
@@ -461,5 +406,4 @@ export default {
       }, [props.info, slots.info && slots.info()])]);
     };
   }
-
 };

package/components/link.d.ts

@@ -82,10 +82,6 @@ declare const Link: DefineComponent<
       type: StringConstructor;
     },
 
-    iconAurora: {
-      type: StringConstructor;
-    },
-
     iconColor: {
       type: StringConstructor;
     },

package/components/link.js

@@ -1,10 +1,7 @@
 import { resolveComponent as _resolveComponent, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, withCtx as _withCtx, normalizeClass as _normalizeClass, createElementBlock as _createElementBlock, renderSlot as _renderSlot, mergeProps as _mergeProps } from "vue";
-
 function render(_ctx, _cache) {
   const _component_f7_use_icon = _resolveComponent("f7-use-icon");
-
   const _component_f7_badge = _resolveComponent("f7-badge");
-
   return _openBlock(), _createElementBlock("a", _mergeProps({
     ref: "elRef",
     class: _ctx.classes
@@ -13,7 +10,7 @@ function render(_ctx, _cache) {
     icon: _ctx.icon
   }, null, 8, ["icon"])) : _createCommentVNode("", true), _ctx.text ? (_openBlock(), _createElementBlock("span", {
     key: 1,
-    class: _normalizeClass(_ctx.isTabbarLabel ? 'tabbar-label' : '')
+    class: _normalizeClass(_ctx.isTabbarIcons ? 'tabbar-label' : '')
   }, [_createTextVNode(_toDisplayString(_ctx.text) + " ", 1), _ctx.badge ? (_openBlock(), _createBlock(_component_f7_badge, {
     key: 0,
     color: _ctx.badgeColor
@@ -22,7 +19,6 @@ function render(_ctx, _cache) {
     _: 1
   }, 8, ["color"])) : _createCommentVNode("", true)], 2)) : _createCommentVNode("", true), _renderSlot(_ctx.$slots, "default")], 16);
 }
-
 import { computed, ref, inject } from 'vue';
 import { classNames, isStringProp } from '../shared/utils.js';
 import { colorClasses, routerAttrs, routerClasses, actionsAttrs, actionsClasses, colorProps, actionsProps, routerProps, iconProps } from '../shared/mixins.js';
@@ -62,7 +58,6 @@ export default {
     ...actionsProps,
     ...routerProps
   },
-
   setup(props, _ref) {
     let {
       slots
@@ -79,7 +74,7 @@ export default {
     const TabbarContext = inject('TabbarContext', {
       value: {}
     });
-    const isTabbarLabel = computed(() => props.tabbarLabel || TabbarContext.value.tabbarHasLabels);
+    const isTabbarIcons = computed(() => props.tabbarLabel || TabbarContext.value.tabbarHasIcons);
     const attrs = computed(() => {
       const {
         href,
@@ -89,7 +84,6 @@ export default {
       let hrefComputed = href;
       if (href === true) hrefComputed = '#';
       if (href === false) hrefComputed = undefined; // no href attribute
-
       return {
         href: hrefComputed,
         target,
@@ -109,15 +103,13 @@ export default {
       } = props;
       let iconOnlyComputed;
       const hasChildren = slots && slots.default;
-
       if (iconOnly || !text && !hasChildren) {
         iconOnlyComputed = true;
       } else {
         iconOnlyComputed = false;
       }
-
       return classNames({
-        link: !(noLinkClass || isTabbarLabel.value),
+        link: !(noLinkClass || isTabbarIcons.value),
         'icon-only': iconOnlyComputed,
         'tab-link': tabLink || tabLink === '',
         'tab-link-active': tabLinkActive,
@@ -128,11 +120,10 @@ export default {
     return {
       elRef,
       icon,
-      isTabbarLabel,
+      isTabbarIcons,
       attrs,
       classes,
       f7SmartSelect
     };
   }
-
 };

package/components/list-button.js

@@ -1,5 +1,4 @@
 import { toDisplayString as _toDisplayString, renderSlot as _renderSlot, createTextVNode as _createTextVNode, mergeProps as _mergeProps, createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
-
 function render(_ctx, _cache) {
   return _openBlock(), _createElementBlock("li", null, [_createElementVNode("a", _mergeProps({
     ref: "linkElRef",
@@ -10,7 +9,6 @@ function render(_ctx, _cache) {
     })
   }), [_createTextVNode(_toDisplayString(_ctx.title) + " " + _toDisplayString(_ctx.text) + " ", 1), _renderSlot(_ctx.$slots, "default")], 16)]);
 }
-
 import { computed, ref } from 'vue';
 import { classNames, isStringProp } from '../shared/utils.js';
 import { colorClasses, colorProps, actionsAttrs, actionsClasses, actionsProps, routerAttrs, routerClasses, routerProps } from '../shared/mixins.js';
@@ -34,17 +32,14 @@ export default {
     ...routerProps
   },
   emits: ['click'],
-
   setup(props, _ref) {
     let {
       emit
     } = _ref;
     const linkElRef = ref(null);
-
     const onClick = e => {
       emit('click', e);
     };
-
     useTooltip(linkElRef, props);
     useRouteProps(linkElRef, props);
     const linkAttrs = computed(() => {
@@ -73,5 +68,4 @@ export default {
       linkElRef
     };
   }
-
 };

package/components/list-group.js

@@ -1,13 +1,11 @@
 import { renderSlot as _renderSlot, createElementVNode as _createElementVNode, normalizeClass as _normalizeClass, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
 const _hoisted_1 = ["data-sortable-move-elements"];
-
 function render(_ctx, _cache) {
   return _openBlock(), _createElementBlock("div", {
     class: _normalizeClass(_ctx.classes),
     "data-sortable-move-elements": typeof _ctx.sortableMoveElements !== 'undefined' ? _ctx.sortableMoveElements.toString() : undefined
   }, [_createElementVNode("ul", null, [_renderSlot(_ctx.$slots, "default")])], 10, _hoisted_1);
 }
-
 import { computed, provide, inject } from 'vue';
 import { classNames } from '../shared/utils.js';
 import { colorClasses, colorProps } from '../shared/mixins.js';
@@ -26,7 +24,6 @@ export default {
     },
     ...colorProps
   },
-
   setup(props) {
     const ListContextParent = inject('ListContext', {
       value: {
@@ -53,5 +50,4 @@ export default {
       classes
     };
   }
-
 };

package/components/list-index.d.ts

@@ -39,11 +39,6 @@ declare const ListIndex: DefineComponent<
       default: number;
     },
 
-    auroraItemHeight: {
-      type: NumberConstructor;
-      default: number;
-    },
-
     color: {
       type: StringConstructor;
     },