framework7-vue 7.0.9 → 8.0.0-beta.1

package/components/list-index.js

@@ -1,12 +1,10 @@
 import { renderSlot as _renderSlot, normalizeClass as _normalizeClass, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
-
 function render(_ctx, _cache) {
   return _openBlock(), _createElementBlock("div", {
     ref: "elRef",
     class: _normalizeClass(_ctx.classes)
   }, [_renderSlot(_ctx.$slots, "default")], 2);
 }
-
 import { computed, ref, onMounted, onBeforeUnmount, watch } from 'vue';
 import { classNames } from '../shared/utils.js';
 import { colorClasses, colorProps } from '../shared/mixins.js';
@@ -40,31 +38,23 @@ export default {
       type: Number,
       default: 14
     },
-    auroraItemHeight: {
-      type: Number,
-      default: 14
-    },
     ...colorProps
   },
   emits: ['listindex:select'],
-
   setup(props, _ref) {
     let {
       emit
     } = _ref;
     let f7ListIndex = null;
     const elRef = ref(null);
-
     const update = () => {
       if (!f7ListIndex) return;
       f7ListIndex.update();
     };
-
     const scrollListToIndex = indexContent => {
       if (!f7ListIndex) return;
       f7ListIndex.scrollListToIndex(indexContent);
     };
-
     watch(() => props.indexes, newValue => {
       if (!f7ListIndex) return;
       f7ListIndex.params.indexes = newValue;
@@ -79,14 +69,12 @@ export default {
           indexes: props.indexes,
           iosItemHeight: props.iosItemHeight,
           mdItemHeight: props.mdItemHeight,
-          auroraItemHeight: props.auroraItemHeight,
           scrollList: props.scrollList,
           label: props.label,
           on: {
             select(index, itemContent, itemIndex) {
               emit('listindex:select', itemContent, itemIndex);
             }
-
           }
         });
       });
@@ -95,7 +83,6 @@ export default {
       if (f7ListIndex && f7ListIndex.destroy) {
         f7ListIndex.destroy();
       }
-
       f7ListIndex = null;
     });
     const classes = computed(() => classNames('list-index', colorClasses(props)));
@@ -106,5 +93,4 @@ export default {
       scrollListToIndex
     };
   }
-
 };

package/components/list-input.d.ts

@@ -157,10 +157,6 @@ declare const ListInput: DefineComponent<
       type: StringConstructor | NumberConstructor;
     },
 
-    inlineLabel: {
-      type: BooleanConstructor;
-    },
-
     floatingLabel: {
       type: BooleanConstructor;
     },

package/components/list-input.js

@@ -73,7 +73,6 @@ export default {
     outline: Boolean,
     // Label
     label: [String, Number],
-    inlineLabel: Boolean,
     floatingLabel: Boolean,
     // Datepicker
     calendarParams: Object,
@@ -84,7 +83,6 @@ export default {
     ...colorProps
   },
   emits: ['textarea:resize', 'input:notempty', 'input:empty', 'input:clear', 'texteditor:change', 'calendar:change', 'colorpicker:change', 'change', 'focus', 'blur', 'input', 'update:value'],
-
   setup(props, _ref) {
     let {
       emit,
@@ -106,113 +104,87 @@ export default {
     const inputElRef = ref(null);
     const itemContentElRef = 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(inputElRef.value);
       }
-
       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(inputElRef.value);
       }
-
       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[0]);
         emit('update:value', args[0]);
       }
     };
-
     onMounted(() => {
       if (!elRef.value && !itemContentElRef.value) return;
       f7ready(() => {
@@ -221,7 +193,6 @@ export default {
         inputElRef.value.addEventListener('textarea:resize', onTextareaResize, false);
         inputElRef.value.addEventListener('input:empty', onInputEmpty, false);
         inputElRef.value.addEventListener('input:clear', onInputClear, false);
-
         if (props.type === 'datepicker') {
           f7Calendar = f7.calendar.create({
             inputEl: inputElRef.value,
@@ -231,12 +202,10 @@ export default {
                 emit('update:value', calendarValue);
                 emit('calendar:change', calendarValue);
               }
-
             },
             ...(props.calendarParams || {})
           });
         }
-
         if (props.type === 'colorpicker') {
           f7ColorPicker = f7.colorPicker.create({
             inputEl: inputElRef.value,
@@ -246,18 +215,15 @@ export default {
                 emit('update:value', colorPickerValue);
                 emit('colorpicker:change', colorPickerValue);
               }
-
             },
             ...(props.colorPickerParams || {})
           });
         }
-
         if (!(props.validateOnBlur || props.validateOnBlur === '') && (props.validate || props.validate === '') && typeof props.value !== 'undefined' && props.value !== null && props.value !== '') {
           setTimeout(() => {
             validateInput();
           }, 0);
         }
-
         if (props.type === 'textarea' && props.resizable) {
           f7.input.resizeTextarea(inputElRef.value);
         }
@@ -270,12 +236,10 @@ export default {
         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;
@@ -283,15 +247,12 @@ export default {
     });
     onUpdated(() => {
       if (!f7) return;
-
       if (updateInputOnDidUpdate) {
         if (!inputElRef.value) return;
         updateInputOnDidUpdate = false;
-
         if (props.validate && !props.validateOnBlur) {
           validateInput();
         }
-
         if (props.type === 'textarea' && props.resizable) {
           f7.input.resizeTextarea(inputElRef.value);
         }
@@ -308,26 +269,21 @@ export default {
     watch(() => props.value, newValue => {
       if (!f7) return;
       updateInputOnDidUpdate = true;
-
       if (f7Calendar) {
         f7Calendar.setValue(newValue);
       }
-
       if (f7ColorPicker) {
         f7ColorPicker.setValue(newValue);
       }
     });
     const isSortableComputed = computed(() => props.sortable === true || props.sortable === false ? props.sortable : ListContext.value.listIsSortable || false);
-
     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,
@@ -336,17 +292,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,
@@ -389,10 +341,8 @@ export default {
         ...valueProps
       }, [children]);
     };
-
     return () => {
       let inputEl;
-
       if (props.input) {
         if (props.type === 'select' || props.type === 'textarea' || props.type === 'file') {
           if (props.type === 'select') {
@@ -417,14 +367,12 @@ export default {
           inputEl = createInput('input');
         }
       }
-
       const hasErrorMessage = !!props.errorMessage || slots['error-message'];
       const ItemContent = h('div', {
         ref: itemContentElRef,
         class: classNames('item-content item-input', !props.wrap && {
           disabled: props.disabled
         }, !props.wrap && colorClasses(props), {
-          'inline-label': props.inlineLabel,
           'item-input-outline': props.outline,
           'item-input-focused': inputFocused.value,
           'item-input-with-info': !!props.info || slots.info,
@@ -464,5 +412,4 @@ export default {
       }), slots.root && slots.root(), slots['root-end'] && slots['root-end']()]);
     };
   }
-
 };

package/components/list-item-cell.js

@@ -1,9 +1,8 @@
 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);
+  }, [_renderSlot(_ctx.$slots, "default")], 2 /* CLASS */);
 }
 
 import { computed } from 'vue';
@@ -12,14 +11,13 @@ import { colorClasses, colorProps } from '../shared/mixins.js';
 export default {
   name: 'f7-list-item-cell',
   render,
-  props: { ...colorProps
+  props: {
+    ...colorProps
   },
-
   setup(props) {
     const classes = computed(() => classNames('item-cell', colorClasses(props)));
     return {
       classes
     };
   }
-
 };

package/components/list-item-row.js

@@ -1,9 +1,8 @@
 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);
+  }, [_renderSlot(_ctx.$slots, "default")], 2 /* CLASS */);
 }
 
 import { computed } from 'vue';
@@ -12,14 +11,13 @@ import { colorClasses, colorProps } from '../shared/mixins.js';
 export default {
   name: 'f7-list-item-row',
   render,
-  props: { ...colorProps
+  props: {
+    ...colorProps
   },
-
   setup(props) {
     const classes = computed(() => classNames('item-row', colorClasses(props)));
     return {
       classes
     };
   }
-
 };

package/components/list-item.d.ts

@@ -77,10 +77,6 @@ declare const ListItem: DefineComponent<
       type: BooleanConstructor;
     },
 
-    divider: {
-      type: BooleanConstructor;
-    },
-
     groupTitle: {
       type: BooleanConstructor;
     },