vuetify 3.5.6 → 3.5.8

package/dist/vuetify-labs.esm.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.5.6
+* Vuetify v3.5.8
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -3160,17 +3160,19 @@ const MaybeTransition = (props, _ref) => {
   const {
     transition,
     disabled,
+    group,
     ...rest
   } = props;
   const {
-    component = Transition,
+    component = group ? TransitionGroup : Transition,
     ...customProps
   } = typeof transition === 'object' ? transition : {};
   return h(component, mergeProps(typeof transition === 'string' ? {
     name: disabled ? '' : transition
-  } : customProps, rest, {
-    disabled
-  }), slots);
+  } : customProps, typeof transition === 'string' ? {} : {
+    disabled,
+    group
+  }, rest), slots);
 };
 
 // Utilities
@@ -6887,7 +6889,8 @@ const VCheckbox = genericComponent()({
             id,
             messagesId,
             isDisabled,
-            isReadonly
+            isReadonly,
+            isValid
           } = _ref2;
           return createVNode(VCheckboxBtn, mergeProps(checkboxProps, {
             "id": id.value,
@@ -6895,6 +6898,7 @@ const VCheckbox = genericComponent()({
             "disabled": isDisabled.value,
             "readonly": isReadonly.value
           }, controlAttrs, {
+            "error": isValid.value === false,
             "modelValue": model.value,
             "onUpdate:modelValue": $event => model.value = $event,
             "onFocus": focus,
@@ -11844,21 +11848,27 @@ const VSelect = genericComponent()({
         model.value = [item];
       }
     }
+
+    /** @param set - null means toggle */
     function select(item) {
-      let add = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+      let set = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+      if (item.props.disabled) return;
       if (props.multiple) {
         const index = model.value.findIndex(selection => props.valueComparator(selection.value, item.value));
-        add = index === -1;
-        if (add) {
-          model.value = [...model.value, item];
-        } else {
-          const value = [...model.value];
+        const add = set == null ? !~index : set;
+        if (~index) {
+          const value = add ? [...model.value, item] : [...model.value];
           value.splice(index, 1);
           model.value = value;
+        } else if (add) {
+          model.value = [...model.value, item];
         }
       } else {
+        const add = set !== false;
         model.value = add ? [item] : [];
-        menu.value = false;
+        nextTick(() => {
+          menu.value = false;
+        });
       }
     }
     function onBlur(e) {
@@ -11892,14 +11902,9 @@ const VSelect = genericComponent()({
         });
       }
     });
-    watch(displayItems, (val, oldVal) => {
-      if (!isFocused.value) return;
-      if (!val.length && props.hideNoData) {
-        menu.value = false;
-      }
-      if (!oldVal.length && val.length) {
-        menu.value = true;
-      }
+    watch(() => props.items, val => {
+      if (!isFocused.value || !val.length || menu.value) return;
+      menu.value = true;
     });
     useRender(() => {
       const hasChips = !!(props.chips || slots.chip);
@@ -11977,7 +11982,7 @@ const VSelect = genericComponent()({
                 const itemProps = mergeProps(item.props, {
                   ref: itemRef,
                   key: index,
-                  onClick: () => select(item)
+                  onClick: () => select(item, null)
                 });
                 return slots.item?.({
                   item,
@@ -12284,6 +12289,8 @@ const VAutocomplete = genericComponent()({
       }
       return filteredItems.value;
     });
+    const hasChips = computed(() => !!(props.chips || slots.chip));
+    const hasSelectionSlot = computed(() => hasChips.value || !!slots.selection);
     const selectedValues = computed(() => model.value.map(selection => selection.props.value));
     const highlightFirst = computed(() => {
       const selectFirst = props.autoSelectFirst === true || props.autoSelectFirst === 'exact' && search.value === displayItems.value[0]?.title;
@@ -12342,7 +12349,7 @@ const VAutocomplete = genericComponent()({
         }
         const originalSelectionIndex = selectionIndex.value;
         const selectedItem = model.value[selectionIndex.value];
-        if (selectedItem && !selectedItem.props.disabled) select(selectedItem);
+        if (selectedItem && !selectedItem.props.disabled) select(selectedItem, false);
         selectionIndex.value = originalSelectionIndex >= length - 1 ? length - 2 : originalSelectionIndex;
       }
       if (e.key === 'ArrowLeft') {
@@ -12393,36 +12400,41 @@ const VAutocomplete = genericComponent()({
       if (v == null || v === '' && !props.multiple) model.value = [];
     }
     const isSelecting = shallowRef(false);
+
+    /** @param set - null means toggle */
     function select(item) {
-      let add = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+      let set = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
       if (item.props.disabled) return;
       if (props.multiple) {
         const index = model.value.findIndex(selection => props.valueComparator(selection.value, item.value));
-        add = index === -1;
-        if (add) {
-          model.value = [...model.value, item];
-        } else {
-          const value = [...model.value];
+        const add = set == null ? !~index : set;
+        if (~index) {
+          const value = add ? [...model.value, item] : [...model.value];
           value.splice(index, 1);
           model.value = value;
+        } else if (add) {
+          model.value = [...model.value, item];
         }
         if (props.clearOnSelect) {
           search.value = '';
         }
       } else {
+        const add = set !== false;
         model.value = add ? [item] : [];
-        isSelecting.value = true;
-        search.value = add ? item.title : '';
-        menu.value = false;
-        isPristine.value = true;
-        nextTick(() => isSelecting.value = false);
+        search.value = add && !hasSelectionSlot.value ? item.title : '';
+
+        // watch for search watcher to trigger
+        nextTick(() => {
+          menu.value = false;
+          isPristine.value = true;
+        });
       }
     }
     watch(isFocused, (val, oldVal) => {
       if (val === oldVal) return;
       if (val) {
         isSelecting.value = true;
-        search.value = props.multiple ? '' : String(model.value.at(-1)?.props.title ?? '');
+        search.value = props.multiple || hasSelectionSlot.value ? '' : String(model.value.at(-1)?.props.title ?? '');
         isPristine.value = true;
         nextTick(() => isSelecting.value = false);
       } else {
@@ -12452,17 +12464,11 @@ const VAutocomplete = genericComponent()({
         });
       }
     });
-    watch(displayItems, (val, oldVal) => {
-      if (!isFocused.value) return;
-      if (!val.length && props.hideNoData) {
-        menu.value = false;
-      }
-      if (!oldVal.length && val.length) {
-        menu.value = true;
-      }
+    watch(() => props.items, val => {
+      if (!isFocused.value || !val.length || menu.value) return;
+      menu.value = true;
     });
     useRender(() => {
-      const hasChips = !!(props.chips || slots.chip);
       const hasList = !!(!props.hideNoData || displayItems.value.length || slots['prepend-item'] || slots['append-item'] || slots['no-data']);
       const isDirty = model.value.length > 0;
       const textFieldProps = VTextField.filterProps(props);
@@ -12480,7 +12486,7 @@ const VAutocomplete = genericComponent()({
         "class": ['v-autocomplete', `v-autocomplete--${props.multiple ? 'multiple' : 'single'}`, {
           'v-autocomplete--active-menu': menu.value,
           'v-autocomplete--chips': !!props.chips,
-          'v-autocomplete--selection-slot': !!slots.selection,
+          'v-autocomplete--selection-slot': !!hasSelectionSlot.value,
           'v-autocomplete--selecting-index': selectionIndex.value > -1
         }, props.class],
         "style": props.style,
@@ -12535,7 +12541,7 @@ const VAutocomplete = genericComponent()({
                   ref: itemRef,
                   key: index,
                   active: highlightFirst.value && index === 0 ? true : undefined,
-                  onClick: () => select(item)
+                  onClick: () => select(item, null)
                 });
                 return slots.item?.({
                   item,
@@ -12581,8 +12587,8 @@ const VAutocomplete = genericComponent()({
             modelValue: true,
             'onUpdate:modelValue': undefined
           };
-          const hasSlot = hasChips ? !!slots.chip : !!slots.selection;
-          const slotContent = hasSlot ? ensureValidVNode(hasChips ? slots.chip({
+          const hasSlot = hasChips.value ? !!slots.chip : !!slots.selection;
+          const slotContent = hasSlot ? ensureValidVNode(hasChips.value ? slots.chip({
             item,
             index,
             props: slotProps
@@ -12595,7 +12601,7 @@ const VAutocomplete = genericComponent()({
             "key": item.value,
             "class": ['v-autocomplete__selection', index === selectionIndex.value && ['v-autocomplete__selection--selected', textColorClasses.value]],
             "style": index === selectionIndex.value ? textColorStyles.value : {}
-          }, [hasChips ? !slots.chip ? createVNode(VChip, mergeProps({
+          }, [hasChips.value ? !slots.chip ? createVNode(VChip, mergeProps({
             "key": "chip",
             "closable": props.closableChips,
             "size": "small",
@@ -16034,14 +16040,16 @@ const VCombobox = genericComponent()({
       return props.multiple ? transformed : transformed[0] ?? null;
     });
     const form = useForm();
-    const _search = shallowRef(!props.multiple ? model.value[0]?.title ?? '' : '');
+    const hasChips = computed(() => !!(props.chips || slots.chip));
+    const hasSelectionSlot = computed(() => hasChips.value || !!slots.selection);
+    const _search = shallowRef(!props.multiple && !hasSelectionSlot.value ? model.value[0]?.title ?? '' : '');
     const search = computed({
       get: () => {
         return _search.value;
       },
       set: val => {
         _search.value = val ?? '';
-        if (!props.multiple) {
+        if (!props.multiple && !hasSelectionSlot.value) {
           model.value = [transformItem$3(props, val)];
         }
         if (val && props.multiple && props.delimiters?.length) {
@@ -16072,7 +16080,7 @@ const VCombobox = genericComponent()({
       emit('update:search', value);
     });
     watch(model, value => {
-      if (!props.multiple) {
+      if (!props.multiple && !hasSelectionSlot.value) {
         _search.value = value[0]?.title ?? '';
       }
     });
@@ -16137,6 +16145,10 @@ const VCombobox = genericComponent()({
       if (e.key === 'ArrowDown' && highlightFirst.value) {
         listRef.value?.focus('next');
       }
+      if (e.key === 'Enter' && search.value) {
+        select(transformItem$3(props, search.value));
+        if (hasSelectionSlot.value) _search.value = '';
+      }
       if (!props.multiple) return;
       if (['Backspace', 'Delete'].includes(e.key)) {
         if (selectionIndex.value < 0) {
@@ -16170,10 +16182,6 @@ const VCombobox = genericComponent()({
           vTextFieldRef.value.setSelectionRange(0, 0);
         }
       }
-      if (e.key === 'Enter' && search.value) {
-        select(transformItem$3(props, search.value));
-        search.value = '';
-      }
     }
     function onAfterLeave() {
       if (isFocused.value) {
@@ -16184,6 +16192,7 @@ const VCombobox = genericComponent()({
     /** @param set - null means toggle */
     function select(item) {
       let set = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+      if (item.props.disabled) return;
       if (props.multiple) {
         const index = model.value.findIndex(selection => props.valueComparator(selection.value, item.value));
         const add = set == null ? !~index : set;
@@ -16200,7 +16209,7 @@ const VCombobox = genericComponent()({
       } else {
         const add = set !== false;
         model.value = add ? [item] : [];
-        _search.value = add ? item.title : '';
+        _search.value = add && !hasSelectionSlot.value ? item.title : '';
 
         // watch for search watcher to trigger
         nextTick(() => {
@@ -16232,8 +16241,24 @@ const VCombobox = genericComponent()({
         return value === displayItems.value[0].value;
       })) {
         select(displayItems.value[0]);
-      } else if (props.multiple && search.value) {
-        select(transformItem$3(props, search.value));
+        return;
+      }
+      if (search.value) {
+        if (props.multiple) {
+          select(transformItem$3(props, search.value));
+          return;
+        }
+        if (!hasSelectionSlot.value) return;
+        if (model.value.some(_ref3 => {
+          let {
+            title
+          } = _ref3;
+          return title === search.value;
+        })) {
+          _search.value = '';
+        } else {
+          select(transformItem$3(props, search.value));
+        }
       }
     });
     watch(menu, () => {
@@ -16244,17 +16269,11 @@ const VCombobox = genericComponent()({
         });
       }
     });
-    watch(displayItems, (val, oldVal) => {
-      if (!isFocused.value) return;
-      if (!val.length && props.hideNoData) {
-        menu.value = false;
-      }
-      if (!oldVal.length && val.length) {
-        menu.value = true;
-      }
+    watch(() => props.items, val => {
+      if (!isFocused.value || !val.length || menu.value) return;
+      menu.value = true;
     });
     useRender(() => {
-      const hasChips = !!(props.chips || slots.chip);
       const hasList = !!(!props.hideNoData || displayItems.value.length || slots['prepend-item'] || slots['append-item'] || slots['no-data']);
       const isDirty = model.value.length > 0;
       const textFieldProps = VTextField.filterProps(props);
@@ -16271,7 +16290,7 @@ const VCombobox = genericComponent()({
         "class": ['v-combobox', {
           'v-combobox--active-menu': menu.value,
           'v-combobox--chips': !!props.chips,
-          'v-combobox--selection-slot': !!slots.selection,
+          'v-combobox--selection-slot': !!hasSelectionSlot.value,
           'v-combobox--selecting-index': selectionIndex.value > -1,
           [`v-combobox--${props.multiple ? 'multiple' : 'single'}`]: true
         }, props.class],
@@ -16317,12 +16336,12 @@ const VCombobox = genericComponent()({
               "renderless": true,
               "items": displayItems.value
             }, {
-              default: _ref3 => {
+              default: _ref4 => {
                 let {
                   item,
                   index,
                   itemRef
-                } = _ref3;
+                } = _ref4;
                 const itemProps = mergeProps(item.props, {
                   ref: itemRef,
                   key: index,
@@ -16336,10 +16355,10 @@ const VCombobox = genericComponent()({
                 }) ?? createVNode(VListItem, mergeProps(itemProps, {
                   "role": "option"
                 }), {
-                  prepend: _ref4 => {
+                  prepend: _ref5 => {
                     let {
                       isSelected
-                    } = _ref4;
+                    } = _ref5;
                     return createVNode(Fragment, null, [props.multiple && !props.hideSelected ? createVNode(VCheckboxBtn, {
                       "key": item.value,
                       "modelValue": isSelected,
@@ -16373,8 +16392,8 @@ const VCombobox = genericComponent()({
             modelValue: true,
             'onUpdate:modelValue': undefined
           };
-          const hasSlot = hasChips ? !!slots.chip : !!slots.selection;
-          const slotContent = hasSlot ? ensureValidVNode(hasChips ? slots.chip({
+          const hasSlot = hasChips.value ? !!slots.chip : !!slots.selection;
+          const slotContent = hasSlot ? ensureValidVNode(hasChips.value ? slots.chip({
             item,
             index,
             props: slotProps
@@ -16387,7 +16406,7 @@ const VCombobox = genericComponent()({
             "key": item.value,
             "class": ['v-combobox__selection', index === selectionIndex.value && ['v-combobox__selection--selected', textColorClasses.value]],
             "style": index === selectionIndex.value ? textColorStyles.value : {}
-          }, [hasChips ? !slots.chip ? createVNode(VChip, mergeProps({
+          }, [hasChips.value ? !slots.chip ? createVNode(VChip, mergeProps({
             "key": "chip",
             "closable": props.closableChips,
             "size": "small",
@@ -17355,10 +17374,28 @@ function isSameMonth(date, comparing) {
 function getDiff(date, comparing, unit) {
   const d = new Date(date);
   const c = new Date(comparing);
-  if (unit === 'month') {
-    return d.getMonth() - c.getMonth() + (d.getFullYear() - c.getFullYear()) * 12;
+  switch (unit) {
+    case 'years':
+      return d.getFullYear() - c.getFullYear();
+    case 'quarters':
+      return Math.floor((d.getMonth() - c.getMonth() + (d.getFullYear() - c.getFullYear()) * 12) / 4);
+    case 'months':
+      return d.getMonth() - c.getMonth() + (d.getFullYear() - c.getFullYear()) * 12;
+    case 'weeks':
+      return Math.floor((d.getTime() - c.getTime()) / (1000 * 60 * 60 * 24 * 7));
+    case 'days':
+      return Math.floor((d.getTime() - c.getTime()) / (1000 * 60 * 60 * 24));
+    case 'hours':
+      return Math.floor((d.getTime() - c.getTime()) / (1000 * 60 * 60));
+    case 'minutes':
+      return Math.floor((d.getTime() - c.getTime()) / (1000 * 60));
+    case 'seconds':
+      return Math.floor((d.getTime() - c.getTime()) / 1000);
+    default:
+      {
+        return d.getTime() - c.getTime();
+      }
   }
-  return Math.floor((d.getTime() - c.getTime()) / (1000 * 60 * 60 * 24));
 }
 function setHours(date, count) {
   const d = new Date(date);
@@ -20553,7 +20590,7 @@ const VDatePickerMonth = genericComponent()({
         } else {
           rangeStop.value = _value;
         }
-        const diff = adapter.getDiff(rangeStop.value, rangeStart.value);
+        const diff = adapter.getDiff(rangeStop.value, rangeStart.value, 'days');
         const datesInRange = [rangeStart.value];
         for (let i = 1; i < diff; i++) {
           const nextDate = adapter.addDays(rangeStart.value, i);
@@ -24367,6 +24404,8 @@ const VSwitch = genericComponent()({
       const controlProps = VSelectionControl.filterProps(props);
       return createVNode(VInput, mergeProps({
         "class": ['v-switch', {
+          'v-switch--flat': props.flat
+        }, {
           'v-switch--inset': props.inset
         }, {
           'v-switch--indeterminate': indeterminate.value
@@ -25490,8 +25529,8 @@ const VCalendarIntervalEvent = genericComponent()({
       return createVNode(VSheet, {
         "height": calcHeight().height,
         "density": "comfortable",
-        "style": `width: 100%; margin-top: ${calcHeight().margin}`,
-        "class": "align-center pa-1",
+        "style": `margin-top: ${calcHeight().margin}`,
+        "class": "v-calendar-internal-event",
         "color": props.event?.color ?? undefined,
         "rounded": props.event?.first && props.event?.last ? true : props.event?.first ? 't' : props.event?.last ? 'b' : false
       }, {
@@ -25902,6 +25941,106 @@ const VCalendar = genericComponent()({
   }
 });
 
+const makeVFabProps = propsFactory({
+  app: Boolean,
+  appear: Boolean,
+  extended: Boolean,
+  location: {
+    type: String,
+    default: 'bottom end'
+  },
+  offset: Boolean,
+  modelValue: {
+    type: Boolean,
+    default: true
+  },
+  ...omit(makeVBtnProps({
+    active: true
+  }), ['location']),
+  ...makeLayoutItemProps(),
+  ...makeTransitionProps({
+    transition: 'fab-transition'
+  })
+}, 'VFab');
+const VFab = genericComponent()({
+  name: 'VFab',
+  props: makeVFabProps(),
+  emits: {
+    'update:modelValue': value => true
+  },
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
+    const model = useProxiedModel(props, 'modelValue');
+    const height = shallowRef(56);
+    const layoutItemStyles = ref();
+    const {
+      resizeRef
+    } = useResizeObserver(entries => {
+      if (!entries.length) return;
+      height.value = entries[0].target.clientHeight;
+    });
+    const hasPosition = computed(() => props.app || props.absolute);
+    const position = computed(() => {
+      if (!hasPosition.value) return false;
+      return props.location.split(' ').shift();
+    });
+    const orientation = computed(() => {
+      if (!hasPosition.value) return false;
+      return props.location.split(' ')[1] ?? 'end';
+    });
+    useToggleScope(() => props.app, () => {
+      const layout = useLayoutItem({
+        id: props.name,
+        order: computed(() => parseInt(props.order, 10)),
+        position,
+        layoutSize: height,
+        elementSize: computed(() => height.value + 32),
+        active: computed(() => props.app && model.value),
+        absolute: toRef(props, 'absolute')
+      });
+      watchEffect(() => {
+        layoutItemStyles.value = layout.layoutItemStyles.value;
+      });
+    });
+    const vFabRef = ref();
+    useRender(() => {
+      const btnProps = VBtn.filterProps(props);
+      return createVNode("div", {
+        "ref": vFabRef,
+        "class": ['v-fab', {
+          'v-fab--absolute': props.absolute,
+          'v-fab--app': !!props.app,
+          'v-fab--extended': props.extended,
+          'v-fab--offset': props.offset,
+          [`v-fab--${position.value}`]: hasPosition.value,
+          [`v-fab--${orientation.value}`]: hasPosition.value
+        }, props.class],
+        "style": [props.app ? {
+          ...layoutItemStyles.value
+        } : {
+          height: 'inherit',
+          width: undefined
+        }, props.style]
+      }, [createVNode("div", {
+        "class": "v-fab__container"
+      }, [createVNode(MaybeTransition, {
+        "appear": props.appear,
+        "transition": props.transition
+      }, {
+        default: () => [withDirectives(createVNode(VBtn, mergeProps({
+          "ref": resizeRef
+        }, btnProps, {
+          "active": undefined,
+          "location": undefined
+        }), slots), [[vShow, props.active]])]
+      })])]);
+    });
+    return {};
+  }
+});
+
 // Utilities
 
 // Types
@@ -25940,10 +26079,16 @@ const makeLineProps = propsFactory({
     default: 4
   },
   id: String,
+  itemValue: {
+    type: String,
+    default: 'value'
+  },
   modelValue: {
     type: Array,
     default: () => []
   },
+  min: [String, Number],
+  max: [String, Number],
   padding: {
     type: [String, Number],
     default: 8
@@ -25985,6 +26130,7 @@ const VBarline = genericComponent()({
         maxY: parseInt(props.height, 10)
       };
     });
+    const items = computed(() => props.modelValue.map(item => getPropertyFromItem(item, props.itemValue, item)));
     function genBars(values, boundary) {
       const {
         minX,
@@ -25993,10 +26139,10 @@ const VBarline = genericComponent()({
         maxY
       } = boundary;
       const totalValues = values.length;
-      let maxValue = Math.max(...values);
-      let minValue = Math.min(...values);
-      if (minValue > 0) minValue = 0;
-      if (maxValue < 0) maxValue = 0;
+      let maxValue = props.max != null ? Number(props.max) : Math.max(...values);
+      let minValue = props.min != null ? Number(props.min) : Math.min(...values);
+      if (minValue > 0 && props.min == null) minValue = 0;
+      if (maxValue < 0 && props.max == null) maxValue = 0;
       const gridX = maxX / totalValues;
       const gridY = (maxY - minY) / (maxValue - minValue || 1);
       const horizonY = maxY - Math.abs(minValue * gridY);
@@ -26012,7 +26158,7 @@ const VBarline = genericComponent()({
     }
     const parsedLabels = computed(() => {
       const labels = [];
-      const points = genBars(props.modelValue.map(item => typeof item === 'number' ? item : item.value), boundary.value);
+      const points = genBars(items.value, boundary.value);
       const len = points.length;
       for (let i = 0; labels.length < len; i++) {
         const item = points[i];
@@ -26027,7 +26173,7 @@ const VBarline = genericComponent()({
       }
       return labels;
     });
-    const bars = computed(() => genBars(props.modelValue.map(item => typeof item === 'number' ? item : item.value), boundary.value));
+    const bars = computed(() => genBars(items.value, boundary.value));
     const offsetX = computed(() => (Math.abs(bars.value[0].x - bars.value[1].x) - lineWidth.value) / 2);
     useRender(() => {
       const gradientData = !props.gradient.slice().length ? [''] : props.gradient.slice().reverse();
@@ -26177,8 +26323,8 @@ const VTrendline = genericComponent()({
         maxY
       } = boundary;
       const totalValues = values.length;
-      const maxValue = Math.max(...values);
-      const minValue = Math.min(...values);
+      const maxValue = props.max != null ? Number(props.max) : Math.max(...values);
+      const minValue = props.min != null ? Number(props.min) : Math.min(...values);
       const gridX = (maxX - minX) / (totalValues - 1);
       const gridY = (maxY - minY) / (maxValue - minValue || 1);
       return values.map((value, index) => {
@@ -26205,9 +26351,10 @@ const VTrendline = genericComponent()({
         maxY: parseInt(props.height, 10) - padding
       };
     });
+    const items = computed(() => props.modelValue.map(item => getPropertyFromItem(item, props.itemValue, item)));
     const parsedLabels = computed(() => {
       const labels = [];
-      const points = genPoints(props.modelValue.map(item => typeof item === 'number' ? item : item.value), boundary.value);
+      const points = genPoints(items.value, boundary.value);
       const len = points.length;
       for (let i = 0; labels.length < len; i++) {
         const item = points[i];
@@ -26251,6 +26398,9 @@ const VTrendline = genericComponent()({
     }, {
       immediate: true
     });
+    function genPath$1(fill) {
+      return genPath(genPoints(items.value, boundary.value), props.smooth ? 8 : Number(props.smooth), fill, parseInt(props.height, 10));
+    }
     useRender(() => {
       const gradientData = !props.gradient.slice().length ? [''] : props.gradient.slice().reverse();
       return createVNode("svg", {
@@ -26282,9 +26432,13 @@ const VTrendline = genericComponent()({
         value: item.value
       }) ?? item.value]))]), createVNode("path", {
         "ref": path,
-        "d": genPath(genPoints(props.modelValue.map(item => typeof item === 'number' ? item : item.value), boundary.value), props.smooth ? 8 : Number(props.smooth), props.fill, parseInt(props.height, 10)),
+        "d": genPath$1(props.fill),
         "fill": props.fill ? `url(#${id.value})` : 'none',
         "stroke": props.fill ? 'none' : `url(#${id.value})`
+      }, null), props.fill && createVNode("path", {
+        "d": genPath$1(false),
+        "fill": "none",
+        "stroke": props.color ?? props.gradient?.[0]
       }, null)]);
     });
   }
@@ -26334,6 +26488,183 @@ const VSparkline = genericComponent()({
   }
 });
 
+const makeVSpeedDialProps = propsFactory({
+  ...makeComponentProps(),
+  ...makeVMenuProps({
+    offset: 8,
+    minWidth: 0,
+    location: 'top center'
+  }),
+  ...makeTransitionProps({
+    transition: 'fade-transition'
+  })
+}, 'VSpeedDial');
+const VSpeedDial = genericComponent()({
+  name: 'VSpeedDial',
+  props: makeVSpeedDialProps(),
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
+    useRender(() => {
+      const menuProps = VMenu.filterProps(props);
+      return createVNode(VMenu, mergeProps(menuProps, {
+        "class": props.class,
+        "style": props.style,
+        "contentClass": "v-speed-dial__content"
+      }), {
+        default: () => [createVNode(VDefaultsProvider, {
+          "defaults": {
+            VBtn: {
+              size: 'small'
+            }
+          }
+        }, {
+          default: () => [createVNode(MaybeTransition, {
+            "appear": true,
+            "group": true,
+            "transition": props.transition
+          }, {
+            default: () => [slots.default?.()]
+          })]
+        })]
+      });
+    });
+    return {};
+  }
+});
+
+// Types
+
+// Types
+
+const makeVEmptyStateProps = propsFactory({
+  actionText: String,
+  bgColor: String,
+  color: String,
+  icon: IconValue,
+  image: String,
+  justify: {
+    type: String,
+    default: 'center'
+  },
+  headline: String,
+  title: String,
+  text: String,
+  textWidth: {
+    type: [Number, String],
+    default: 500
+  },
+  href: String,
+  to: String,
+  ...makeComponentProps(),
+  ...makeDimensionProps(),
+  ...makeSizeProps({
+    size: undefined
+  }),
+  ...makeThemeProps()
+}, 'VEmptyState');
+const VEmptyState = genericComponent()({
+  name: 'VEmptyState',
+  props: makeVEmptyStateProps(),
+  emits: {
+    'click:action': e => true
+  },
+  setup(props, _ref) {
+    let {
+      emit,
+      slots
+    } = _ref;
+    const {
+      themeClasses
+    } = provideTheme(props);
+    const {
+      backgroundColorClasses,
+      backgroundColorStyles
+    } = useBackgroundColor(toRef(props, 'bgColor'));
+    const {
+      dimensionStyles
+    } = useDimension(props);
+    function onClickAction(e) {
+      emit('click:action', e);
+    }
+    useRender(() => {
+      const hasActions = !!(slots.actions || props.actionText);
+      const hasHeadline = !!(slots.headline || props.headline);
+      const hasTitle = !!(slots.title || props.title);
+      const hasText = !!(slots.text || props.text);
+      const hasMedia = !!(slots.media || props.image || props.icon);
+      const size = props.size || (props.image ? 200 : 96);
+      return createVNode("div", {
+        "class": ['v-empty-state', {
+          [`v-empty-state--${props.justify}`]: true
+        }, themeClasses.value, backgroundColorClasses.value, props.class],
+        "style": [backgroundColorStyles.value, dimensionStyles.value, props.style]
+      }, [hasMedia && createVNode("div", {
+        "key": "media",
+        "class": "v-empty-state__media"
+      }, [!slots.media ? createVNode(Fragment, null, [props.image ? createVNode(VImg, {
+        "key": "image",
+        "src": props.image,
+        "height": size
+      }, null) : props.icon ? createVNode(VIcon, {
+        "key": "icon",
+        "size": size,
+        "icon": props.icon
+      }, null) : undefined]) : createVNode(VDefaultsProvider, {
+        "key": "media-defaults",
+        "defaults": {
+          VImg: {
+            src: props.image,
+            height: size
+          },
+          VIcon: {
+            size,
+            icon: props.icon
+          }
+        }
+      }, {
+        default: () => [slots.media()]
+      })]), hasHeadline && createVNode("div", {
+        "key": "headline",
+        "class": "v-empty-state__headline"
+      }, [slots.headline?.() ?? props.headline]), hasTitle && createVNode("div", {
+        "key": "title",
+        "class": "v-empty-state__title"
+      }, [slots.title?.() ?? props.title]), hasText && createVNode("div", {
+        "key": "text",
+        "class": "v-empty-state__text",
+        "style": {
+          maxWidth: convertToUnit(props.textWidth)
+        }
+      }, [slots.text?.() ?? props.text]), slots.default && createVNode("div", {
+        "key": "content",
+        "class": "v-empty-state__content"
+      }, [slots.default()]), hasActions && createVNode("div", {
+        "key": "actions",
+        "class": "v-empty-state__actions"
+      }, [createVNode(VDefaultsProvider, {
+        "defaults": {
+          VBtn: {
+            class: 'v-empty-state__action-btn',
+            color: props.color,
+            text: props.actionText
+          }
+        }
+      }, {
+        default: () => [slots.actions?.({
+          props: {
+            onClick: onClickAction
+          }
+        }) ?? createVNode(VBtn, {
+          "onClick": onClickAction
+        }, null)]
+      })])]);
+    });
+    return {};
+  }
+});
+
 var components = /*#__PURE__*/Object.freeze({
   __proto__: null,
   VAlert: VAlert,
@@ -26403,12 +26734,14 @@ var components = /*#__PURE__*/Object.freeze({
   VDialogTopTransition: VDialogTopTransition,
   VDialogTransition: VDialogTransition,
   VDivider: VDivider,
+  VEmptyState: VEmptyState,
   VExpandTransition: VExpandTransition,
   VExpandXTransition: VExpandXTransition,
   VExpansionPanel: VExpansionPanel,
   VExpansionPanelText: VExpansionPanelText,
   VExpansionPanelTitle: VExpansionPanelTitle,
   VExpansionPanels: VExpansionPanels,
+  VFab: VFab,
   VFabTransition: VFabTransition,
   VFadeTransition: VFadeTransition,
   VField: VField,
@@ -26478,6 +26811,7 @@ var components = /*#__PURE__*/Object.freeze({
   VSnackbar: VSnackbar,
   VSpacer: VSpacer,
   VSparkline: VSparkline,
+  VSpeedDial: VSpeedDial,
   VStepper: VStepper,
   VStepperActions: VStepperActions,
   VStepperHeader: VStepperHeader,
@@ -26725,7 +27059,7 @@ function createVuetify$1() {
     goTo
   };
 }
-const version$1 = "3.5.6";
+const version$1 = "3.5.8";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -26739,7 +27073,7 @@ function inject(key) {
 
 /* eslint-disable local-rules/sort-imports */
 
-const version = "3.5.6";
+const version = "3.5.8";
 
 /* eslint-disable local-rules/sort-imports */